部署Davinci开发环境

部署Davinci开发环境，前后端分离

技术框架

Davinci 采用前后端分离的方式，后端java系，前端react，图表echarts。

前端：Antd + ES6 + TypeScript + WebPack

• Antd：Ant Design of React，基于 Ant Design 设计体系的 React UI 组件库，是蚂蚁金服一套开箱即用的高质量 React 组件，Davici 用Reac 实现，此外Ant Design 还有 Angular、Vue 的实现
• ES6：新一代js语法，过！
• TypeScript：一种由微软开发的开源、跨平台的编程语言，JavaScript的超集，最终会被编译为JavaScript代码
• WebPack：打包工具，过！

后端：springboot + mybatis-plus + maven

后端java，标准的springboot、mybatis-plus框架，容易理解。

此外采用swagger框架生成api接口说明。

图表库：echart，特点就是使用和集成简单，但是没有D3那么灵活。

环境准备

jdk 1.8+
maven 
mysql
idea
webstorm
nodejs

通过git将代码从GitHub上Clone下来：https://gitee.com/mirrors/Davinci.git

后端

1. 代码的目录结构如下：

   

   assembly/ 目录是用来设置maven打包的目录结构以及其他一些配置，比如打包成什么类型（jar/zip...）。点这里可看详细介绍。
   bin/ 目录是一些脚本执行文件，包括数据库初始化配置，服务启动停止脚本等
   config/ 目录是一些配置文件
   webapp/ 目录中是前端源代码在
   davinci-ui/ 目录为编译后的前端文件
   server/ 目录为端代码及核心配置
   logs/ 为日志目录
   
   注：若根目录没有log/目录，则需手动创建，目录结构如下：
   ├── logs        # 日志根目录
     ├── sys         # 系统日志目录
     └── user        # 用户日志目录
     	 ├── opt        # 用户操作日志
     	 └── sql        # 用户Sql日志
   

2. 配置环境变量： DAVINCI3_HOME

   

3. 创建Davinci 数据库，执行 bin/davinci.sql数据库执行语句创建表及插入数据

4. 更新config目录下的文件去掉example后缀，变为application.yml，datasource_driver.yml

5. 根据数据库的版本配置server/pom.xml的mysql依赖

   <dependency>
       <groupId>mysql</groupId>
       <artifactId>mysql-connector-java</artifactId>
       <version>8.0.25</version>
   </dependency>
   

6. 配置config/application.yml，主要变更datasource及mail的配置

   #  <<
   #  Davinci
   #  ==
   #  Copyright (C) 2016 - 2019 EDP
   #  ==
   #  Licensed under the Apache License, Version 2.0 (the "License");
   #  you may not use this file except in compliance with the License.
   #  You may obtain a copy of the License at
   #        http://www.apache.org/licenses/LICENSE-2.0
   #   Unless required by applicable law or agreed to in writing, software
   #   distributed under the License is distributed on an "AS IS" BASIS,
   #   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   #   See the License for the specific language governing permissions and
   #   limitations under the License.
   #  >>
   
   
   server:
     protocol: http
     address: 127.0.0.1
     port: 8080
   
     servlet:
       context-path: /
   
     # Used for mail and download services, can be empty, careful configuration
     # By default, 'server.address' and 'server.port' is used as the string value.
     # access:
     #  address:
     #  port:
   
   
   ## jwt is one of the important configuration of the application
   ## jwt config cannot be null or empty
   jwtToken:
     secret: secret
     timeout: 1800000
     algorithm: HS512
   
   
   ## your datasource config
   source:
     initial-size: 1
     min-idle: 1
     max-wait: 30000
     max-active: 10
     break-after-acquire-failure: true
     connection-error-retry-attempts: 1
     time-between-eviction-runs-millis: 2000
     min-evictable-idle-time-millis: 600000
     max-evictable-idle-time-millis: 900000
     test-while-idle: true
     test-on-borrow: false
     test-on-return: false
     validation-query: select 1
     validation-query-timeout: 10
     keep-alive: false
     filters: stat
   
     enable-query-log: false
     result-limit: 1000000
   
   
   spring:
     mvc:
       async:
         request-timeout: 30s
     rest:
       proxy-host:
       proxy-port:
       proxy-ignore:
   
   
     ## davinci datasource config
     datasource:
       type: com.alibaba.druid.pool.DruidDataSource
       url: jdbc:mysql://192.168.80.77:3306/Davinci?serverTimezone=GMT%2B8&useSSL=false&useUnicode=true&characterEncoding=UTF-8&zeroDateTimeBehavior=convertToNull&allowMultiQueries=true
       username: 用户名
       password: 密码
       driver-class-name: com.mysql.cj.jdbc.Driver
       initial-size: 1
       min-idle: 1
       max-wait: 30000
       max-active: 10
       break-after-acquire-failure: true
       connection-error-retry-attempts: 1
       time-between-eviction-runs-millis: 2000
       min-evictable-idle-time-millis: 600000
       max-evictable-idle-time-millis: 900000
       test-while-idle: true
       test-on-borrow: false
       test-on-return: false
       validation-query: select 1
       validation-query-timeout: 10
       keep-alive: false
       filters: stat
   
     ## redis config
     ## please choose either of the two ways
     redis:
       isEnable: false
   
     ## standalone config
       host: 127.0.0.1
       port: 6379
   
     ## cluster config
     #  cluster:
     #       nodes:
   
       password:
       database: 0
       timeout: 1000
       jedis:
         pool:
           max-active: 8
           max-wait: 1
           max-idle: 8
           min-idle: 0
   
     ## mail is one of the important configuration of the application
     ## mail config cannot be null or empty
     ## some mailboxes need to be set separately password for the SMTP service)
     mail:
       host: smtp.yeah.net
       port: 25
       username: hengyz@yeah.net
       fromAddress:
       password: 授权码
       nickname: davinci
   
       properties:
         smtp:
           starttls:
             enable: true
             required: true
           auth: true
         mail:
           smtp:
             ssl:
               enable: false
   
     ldap:
       urls:
       username:
       password:
       base:
       domainName:    # domainName 指 企业邮箱后缀，如企业邮箱为：xxx@example.com，这里值为 '@example.com'
   
     security:
       oauth2:
         enable: false
   #      client:
   #        registration:
   #          cas:
   #            provider: cas
   #            client-id: "xxxxx"
   #            client-name: "Sign in with XXX"
   #            client-secret: "xxxxx"
   #            authorization-grant-type: authorization_code
   #            client-authentication-method: post
   #            redirect-uri-template: "{baseUrl}/login/oauth2/code/{registrationId}"
   #            scope: userinfo
   #        provider:
   #          cas:
   #            authorization-uri: https://cas.xxxxx.cn/cas/oauth2.0/authorize
   #            token-uri: https://cas.xxxxx.cn/cas/oauth2.0/accessToken
   #            user-info-uri: https://cas.xxxxx.cn/cas/oauth2.0/profile
   #            user-name-attribute: id
   #            userMapping:
   #              email: "attributes.Email"
   #              name: "attributes.CnName1"
   #              avatar: "attributes.Avatar"
   
   screenshot:
     default_browser: CHROME
     timeout_second: 600
     chromedriver_path: $your_chromedriver_path$
     remote_webdriver_url: $your_remote_webdriver_url$
   
   data-auth-center:
     channels:
       - name:
         base-url:
         auth-code:
   
   statistic:
     enable: false
   
     # You can use external elasticsearch storage [127.0.0.1:9300]
     elastic_urls:
     elastic_user:
     elastic_index_prefix:
   
     # You can also use external mysql storage
     mysql_url:
     mysql_username:
     mysql_password:
   
     # You can also use external kafka
     kafka.bootstrap.servers:
     kafka.topic:
     java.security.krb5.conf:
     java.security.keytab:
     java.security.principal:
   
   encryption:
     maxEncryptSize: 1024
     type: Off # Off is to turn off encryption, to enable encryption, please select AES or RSA
   

7. springboot启动server/DavinciServerApplication

8. 前端的编译文件已经放到davinci-ui目录，根据配置内容访问：

   http://127.0.0.1:8080/，注册用户进行登录

   server:
     protocol: http
     address: 127.0.0.1
     port: 8080
   

前端

1 npm install
2 npm run build
3 build的成功文件在webapp/build目录下，将build的文件放到davinci-ui目录下即可

可能遇到的问题

MySQL远程访问

#创建用户
CREATE USER 'root'@'%' IDENTIFIED BY '你的密码'; 
#分配权限并刷新
GRANT ALL ON *.* TO 'root'@'%'; 
ALTER USER 'root'@'%' IDENTIFIED WITH mysql_native_password BY '你的密码';
FLUSH PRIVILEGES;

后端的tools包报错

可以Alt+Enter提示直接加入

前端的build报错Error: pngquant failed to build, make sure that libpng-dev is installed

管理员cmd执行：npm install -g windows-build-tools