Commit 20cb51c5 authored by baoliang's avatar baoliang
Browse files

Merge remote-tracking branch 'upstream/dev-20190415' into dev-20190415

parents bd144ae7 ab74e32a

.gitignore

+2 −0
Original line number Diff line number Diff line
@@ -33,3 +33,5 @@ yarn.lock 
package-lock.json

config.gypi

test/coverage

/docs/zh_CN/介绍

/docs/zh_CN/贡献代码.md

docs/zh_CN/Easyscheduler文档.pdf

0 → 100644
+26.8 MiB

File added.

No diff preview for this file type.

View file

docs/zh_CN/SUMMARY.md

+7 −7
Original line number Diff line number Diff line
@@ -2,17 +2,16 @@ 


* [Easyscheduler简介](README.md)

* 前端部署文档

    * [环境搭建](前端部署文档.md#前端项目环境构建及编译)

    * [安装及配置](前端部署文档.md#安装及配置)

    * [项目生产环境Nginx配置](前端部署文档.md#项目生产环境配置)

    * [前端项目发布](前端部署文档.md#前端项目发布)

    * [问题](前端部署文档.md#问题)

    * [准备工作](前端部署文档.md#1、准备工作)

    * [部署](前端部署文档.md#2、部署)

    * [常见问题](前端部署文档.md#前端常见问题)

* 后端部署文档

    * [后端部署文档](后端部署文档.md#部署文档)  

    * [准备工作](后端部署文档.md#1、准备工作)  

    * [部署](后端部署文档.md#2、部署)  

* [系统使用手册](系统使用手册.md#使用手册)

* [系统架构设计](系统架构设计.md#系统架构设计)

* 前端开发文档

    * [开发环境搭建](前端部署文档.md)

    * [开发环境搭建](前端开发文档.md#开发环境搭建)

    * [项目目录结构](前端开发文档.md#项目目录结构)

    * [系统功能模块](前端开发文档.md#系统功能模块)

    * [路由和状态管理](前端开发文档.md#路由和状态管理)
@@ -20,6 +19,7 @@ 
    * [接口](前端开发文档.md#接口)

    * [扩展开发](前端开发文档.md#扩展开发)   

* 后端开发文档

    * [开发环境搭建](后端开发文档.md#项目编译)

    * [自定义任务插件文档](任务插件开发.md#任务插件开发)

    

    
 No newline at end of file

docs/zh_CN/前端开发文档.md

+70 −0
Original line number Diff line number Diff line
@@ -15,6 +15,75 @@ Jsplumb 连线插件库 
Lodash 高性能的 JavaScript 实用工具库

```





### 开发环境搭建

   

- #### Node安装

Node包下载 (注意版本 8.9.4) `https://nodejs.org/download/release/v8.9.4/` 



- #### 前端项目构建

用命令行模式 `cd`  进入 `escheduler-ui`项目目录并执行 `npm install` 拉取项目依赖包



> 如果 `npm install` 速度非常慢 



> 可以转淘宝镜像命令行输入 `npm install -g cnpm --registry=https://registry.npm.taobao.org`



> 运行 `cnpm install` 







> #####  ！！！这里特别注意 项目如果在拉取依赖包的过程中报 " node-sass error " 错误，请在执行完后再次执行以下命令

```

npm install node-sass --unsafe-perm //单独安装node-sass依赖

```



- #### 开发环境运行

- `npm start` 项目开发环境 (启动后访问地址 http://localhost:8888/#/)





#### 前端项目发布



- `npm run build` 项目打包 (打包后根目录会创建一个名为dist文件夹，用于发布线上Nginx)



运行 `npm run build` 命令，生成打包文件（dist）包



再拷贝到服务器对应的目录下（前端服务静态页面存放目录）



访问地址 `http://localhost:8888/#/` 





#### Liunx下使用node启动并且守护进程



安装pm2 `npm install -g pm2`



在项目`escheduler-ui`根目录执行 `pm2 start npm -- run dev` 启动项目



#### 命令



- 启用 `pm2 start npm -- run dev`



- 停止 `pm2 stop npm`



- 删除 `pm2 delete npm`



- 状态 `pm2 list`



```



[root@localhost escheduler-ui]# pm2 start npm -- run dev

[PM2] Applying action restartProcessId on app [npm](ids: 0)

[PM2] [npm](0) ✓

[PM2] Process successfully started

┌──────────┬────┬─────────┬──────┬──────┬────────┬─────────┬────────┬─────┬──────────┬──────┬──────────┐

│ App name │ id │ version │ mode │ pid  │ status │ restart │ uptime │ cpu │ mem      │ user │ watching │

├──────────┼────┼─────────┼──────┼──────┼────────┼─────────┼────────┼─────┼──────────┼──────┼──────────┤

│ npm      │ 0  │ N/A     │ fork │ 6168 │ online │ 31      │ 0s     │ 0%  │ 5.6 MB   │ root │ disabled │

└──────────┴────┴─────────┴──────┴──────┴────────┴─────────┴────────┴─────┴──────────┴──────┴──────────┘

 Use `pm2 show <id|name>` to get more details about an app



```





### 项目目录结构



`build` 打包及开发环境项目的一些webpack配置
@@ -64,6 +133,7 @@ Lodash 高性能的 JavaScript 实用工具库 


`util` => 工具





### 系统功能模块



首页 => `http://localhost:8888/#/home`

docs/zh_CN/前端部署文档.md

+29 −99
Original line number Diff line number Diff line 
# 前端部署文档



- ##### 1. 开发环境搭建

前端有3种部署方式，分别为自动化部署，手动部署和编译源码部署



- ##### 2. 自动化部署

## 1、准备工作

#### 准备一：下载安装包



- ##### 3. 手动部署

目前最新安装包版本是1.0.1，下载地址： [码云下载](https://gitee.com/easyscheduler/EasyScheduler/attach_files/)



- ##### 4. Liunx下使用node启动并且守护进程

下载escheduler-ui-1.0.1.tar.gz后，解压后会产生dist目录,进入dist目录

> cd dist  



#### 准备二：新建一个`.env`文件



### 1.开发环境搭建

   

- #### node安装

Node包下载 (注意版本 8.9.4) `https://nodejs.org/download/release/v8.9.4/` 



- #### 前端项目构建

用命令行模式 `cd`  进入 `escheduler-ui`项目目录并执行 `npm install` 拉取项目依赖包



> 如果 `npm install` 速度非常慢 



> 可以转淘宝镜像命令行输入 `npm install -g cnpm --registry=https://registry.npm.taobao.org`



> 运行 `cnpm install` 







> #####  ！！！这里特别注意 项目如果在拉取依赖包的过程中报 " node-sass error " 错误，请在执行完后再次执行以下命令

```

npm install node-sass --unsafe-perm //单独安装node-sass依赖

```



在项目`escheduler-ui`根目录`.env`添加代理的端口地址

在dist目录下新建一个`.env`文件，在文件里添加后端服务的ip地址和端口，用于跟后端交互，`.env`文件内容如下：

```

# 前端代理的接口地址（例）

API_BASE = http://192.168.220.204:12345

# 代理的接口地址（自行修改）

API_BASE = http://192.168.xx.xx:12345



# 如果您需要用ip访问项目可以把 "#" 号去掉（例）

#DEV_HOST = 192.168.6.132

#DEV_HOST = 192.168.xx.xx

```

运行

- `npm start` 项目开发环境 (启动后访问地址 http://localhost:8888/#/)



- `npm run build` 项目打包 (打包后根目录会创建一个名为dist文件夹，用于发布线上Nginx)

## 2、部署

以下两种方式任选其一部署即可，推荐自动化部署

### 2.1 自动化部署







### 2.自动化部署



在项目`escheduler-ui`根目录编辑安装文件`vi install(线上环境).sh`

在前端项目根目录dist下编辑安装文件`vi install(线上环境).sh`(执行时，最好修改install(线上环境).sh为install-ui.sh,跟后端部署区分)



更改前端访问端口和后端代理接口地址
@@ -56,40 +34,26 @@ API_BASE = http://192.168.220.204:12345 
esc_proxy="8888"



# 配置代理后端接口

esc_proxy_port="http://192.168.220.154:12345"

esc_proxy_port="http://192.168.xx.xx:12345"

```



前端自动部署基于`yum`操作，部署之前请先安装更新`yum

前端自动部署基于linux系统`yum`操作，部署之前请先安装更新`yum`



在项目`escheduler-ui`根目录执行`./install(线上环境).sh` 

在前端项目根目录dist下执行`./install(线上环境).sh` 或者改名后的 `./install-ui.sh`









### 3.手动部署

### 2.2 手动部署



安装epel源 `yum install epel-release -y`



安装Nginx `yum install nginx -y`



#### 命令



- 启用 `systemctl enable nginx`



- 重启 `systemctl restart nginx`



- 状态 `systemctl status nginx`





> ####  创建静态页面存放目录

```

mkdir /data2_4T/escheduler_front/escheduler/server

```

> ####  配置文件地址

> ####  nginx配置文件地址

```

/etc/nginx/conf.d/escheduler.conf

/etc/nginx/conf.d/default.conf

```

> ####  配置信息

> ####  配置信息(自行修改)

```

server {

    listen       8888;# 访问端口
@@ -97,11 +61,11 @@ server { 
    #charset koi8-r;

    #access_log  /var/log/nginx/host.access.log  main;

    location / {

        root   /data2_4T/escheduler_front/escheduler/server; # 静态文件目录

        root   /xx/dist; # 上面前端解压的dist目录地址(自行修改)

        index  index.html index.html;

    }

    location /escheduler {

        proxy_pass http://192.168.220.181:12345; # 接口地址

        proxy_pass http://192.168.xx.xx:12345; # 接口地址(自行修改)

        proxy_set_header Host $host;

        proxy_set_header X-Real-IP $remote_addr;

        proxy_set_header x_real_ipP $remote_addr;
@@ -128,50 +92,16 @@ server { 
systemctl restart nginx

```



#### nginx命令



#### 前端项目发布



前端在开发环境（dev）中运行 `npm run build` 命令，生成打包文件（dist）包



再拷贝到服务器 `/data2_4T/escheduler_front/escheduler/server`（服务器静态页面存放目录）



访问地址 `http://localhost:8888/#/` 







### 4.Liunx下使用node启动并且守护进程



安装pm2 `npm install -g pm2`



在项目`escheduler-ui`根目录执行 `pm2 start npm -- run dev` 启动项目



#### 命令



- 启用 `pm2 start npm -- run dev`



- 停止 `pm2 stop npm`



- 删除 `pm2 delete npm`



- 状态 `pm2 list`



```

- 启用 `systemctl enable nginx`



[root@localhost escheduler-ui]# pm2 start npm -- run dev

[PM2] Applying action restartProcessId on app [npm](ids: 0)

[PM2] [npm](0) ✓

[PM2] Process successfully started

┌──────────┬────┬─────────┬──────┬──────┬────────┬─────────┬────────┬─────┬──────────┬──────┬──────────┐

│ App name │ id │ version │ mode │ pid  │ status │ restart │ uptime │ cpu │ mem      │ user │ watching │

├──────────┼────┼─────────┼──────┼──────┼────────┼─────────┼────────┼─────┼──────────┼──────┼──────────┤

│ npm      │ 0  │ N/A     │ fork │ 6168 │ online │ 31      │ 0s     │ 0%  │ 5.6 MB   │ root │ disabled │

└──────────┴────┴─────────┴──────┴──────┴────────┴─────────┴────────┴─────┴──────────┴──────┴──────────┘

 Use `pm2 show <id|name>` to get more details about an app

- 重启 `systemctl restart nginx`



```

- 状态 `systemctl status nginx`





## 问题

## 前端常见问题

####  1. 上传文件大小限制

编辑配置文件 `vi /etc/nginx/nginx.conf`

```