本地工具链

前端工程化是以规范工作流程为手段，以工具为实现媒介，最终目的是为了提高研发效率以及保证Web产品的线上质量。

前端工程化是一系列工具和规范的组合，规范为蓝本，工具为实现
规范包括：

  • 项目文件组织结构
  • 源代码开发规范
  • 工具使用规范
  • 每个阶段环境的依赖

工具的作用是将规范具化为具体功能并在一定程度上讲开发者限定在既有的范围内。

它的形成可以降低业务开发人员学习和使用工具的成本，工具链可以将复杂需求功能和解决方案交给工具链内部解决，然后只需要暴露给开发人员使用方法即可。
工具链的统一，另一个好处就是巩固流程的规范性，开发者都使用统一的工具链、遵循统一的规范编码，利于多人协作与程序的维护。

总结一下有两个优势

  1. 将开发者限定在既有的规范内
  2. 利于多人协作开发

管理平台

本地工具链的形成虽然解决了开发过程中的一些痛点，但是由于功能模块全在本地环境工作，必然会受到环境差异的影响，比如操作系统类型、版本控制、内核等，这些因素会在一定程度上影响构建产出代码的一致性。当然除了环境因素，权限也是一个大的问题，想象一下，所有的开发都可以通过本地工具链向生产环境部署文件则会存在大的安全隐患。（或者线上版本出错，需要回滚等

这就体现出了管理平台的优势：

  • 淡化环境差异性，保证构建产出的一致性
  • 权限集中管理，提高安全性
  • 项目版本集中管理，便于危机处理（比如版本回滚

其它场景（差异化抹平

比如进行混合开发，有些数据需要从 app 获取，但是对前端来说在app中调试复杂，页面过于依赖app，例如：数据获取不到，api 调不到等问题，都会影响项目在浏览器中正常启动，因此，差异抹平也是提高开发效率的

存储API

在移动端使用jsbridge方法，在浏览器端使用localstorage，保持统一性

数据获取API

由于在app内使用 jsbridge 获取 app中的离线包，通过离线包机制，通过 fallback 文件 + node 转发，做出可以获取到 app 数据的接口，在API内部做兼容，达到统一

路由跳转

在app中，使用 openGmu 新开页面，在浏览器中，使用正常的 this.$route.push 方法

尽量减少调用app的方法，降低耦合

能通过h5自己实现的，最好不要使用app的方法

工程方案

工程方案的代码初始化也是做了模板代码初始化，新建仓库，push 代码等操作，与在本机执行脚手架并无大的不同。但是，工程方案的代码初始化完全是在云端容器执行的，最大程度的避免了本地环境差异造成的失败问题，且过程全自动，不需人工干预，大大节省时间。更妙的是，工程方案的项目创建可以一次性将各种服务（比如 SCM，GoofyWeb 部署等）及发布流水线（比如 DevOps）创建好，项目创建完成后即可进行发布。
链接：https://juejin.cn/post/6979031557285609479

本地命令行控制云端创建项目（webshell），然后命令行配置项目cli，webhooks 配置打包钩子
如果要考虑到权限的话，最好是有权限管理平台