[Jenkins进阶]-前端CI/CD

什么是前端自动化

前端自动化不是指自动生成代码，而是自动化构建项目。

如果没有自动化， 我们的前端从开发到提测工作流程可能如下：

1.本地机器上写代码

2.在命令行输入 npm run unit/lint，查看单元测试/eslint 校验结果

3.提交代码，push 到 git 远程仓库

4.执行 npm run build，构建项目

5.ssh/ftp 发包至测试服务器等各种方式

这个流程中，每一个步骤都要重复人工操作，很大增加了时间成本，不能保证操作的准确性。对于 unit 或者 build 的结果，没有一个自动的反馈机制，需要人工 check 运行结果，最后部署也是人工登录服务器执行脚本，非常繁琐。

引入自动化以后，整个流程变成：

1.本地机器上写代码

2.提交代码，push 到 git 远程仓库

3.git hook 触发 jenkins 的构建 job

4.jenkins job 中拉取项目代码，运行 npm run unit/lint 和 npm run build。

5.jenkins job 中执行测试服务器的部署脚本

在 自动化流程中，只有步骤 1 和步骤 2 需要人工操作，其他步骤都是自动运行，是一个非常标准化的流程，减少了人工操作的风险，省去了重复性工作，增强了项目的可见性。

效果图

实现

流程图

• 开发人员提交代码至代码库
• 触发 jenki 构建任务
• 构建成功，发包至 nginx 服务器，更新完毕
• 构建失败