前端自动化介绍

DevOps介绍

相信大家或多或少的听过这个词DevOps，而且看起来很高大上，其实这个是敏捷开发的一种执行流程表现，先来一张经典的DevOps流程图：

具体的流程为：

• 先是计划plan，编码code，然后编译build，测试test（Dev）
• 然后发布release，部署deploy，运维operate，监控monitor（Ops）
• 然后发现问题或有新的需求，就重新计划plan。。。如此循环
  这就是完整的DevOps流程。

下面看一下详细的开发环境和流程以及自动化能帮我们做什么：

首先我们开发关注的只有本地开发这个环节，本地环境也可以是打包好的环境，对接自动化流程的开发环境，提交到Git flow，自动触发自动化流程，根据git提交的分支和信息，确定自动化发布流程。如果有bug可以从缺陷控制查看具体信息，然后本地开发确认是否有问题，根据bug的环境来测试修复，再提交到Git flow，待发布成功后告知缺陷控制系统，然后测试再去验证做好记录，如果测试完成就关闭bug。

可见自动化流程只需要我们关注代码的开发，至于构建、打包、测试、部署等步骤可以自动完成，能够减少我们后期运维的工作量。

前端自动化

前端自动化是指前端代码的自动化构建、打包、测试及部署等流程。

持续集成（Continuous Integration）CI
持续部署（Continuous Deployment）CD

前端自动化通常与CI/CD流程相结合。

自动化流程的意义

• 减少人为失误，提高软件质量
• 效率迭代，便捷部署
• 快速交付，便于管理

自动化相关概念

问题提出

小项目

• 代码少，页面单一
• 管理扁平，部署简单
• 维护简单
  特点：开发/测试、发布集一身
  缺点：很难延续，交接困难

工程化的中等项目

• 多页面，功能复杂
• 资源文件较多，有性能需求
• 有协同需求，代码模块化，形成工程目录
  特点：需快速开发，快速迭代
  缺点：难协同

自动化

• 企业级应用，多场景，多团队
• 开发/测试、部署流程化，自动化
• 简易部署，快速迭代
• 版本控制，专注功能
  特点：专注代码遍写和开发流程
  缺点：比较难推动

常见现象

• 常因为版本、环境问题加班、返工
• 开发效率无法提升，测试部署工作常有推诿
• 公司运维工作好“闲”

最佳实践

• 基本的版本控制，培养协同效率
• 创建工程化项目，参与开源项目实战
• 按需取用，推动团队自动化流程