一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第22天，点击查看活动详情。
前端工程化都有哪些方面，这篇文章我们来从全局地视角来看看什么是前端工程化，前端工程化都包含哪些方面。这样才能保证做前端工程化改造的时候做到全面没有遗漏。
前端工程化顾名思义，就是将系统化工程化可以度量的方法应用到前端的开发、上线及后续维护过程。目的就是提高效率及质量，降低开发难度及开发成本。
从这个意义上来说前端工程化包含的东西就很广泛了，但是我们需要一个思路把整个前端工程化给串起来，那么我们就大体按照前端从开发到上线的流程来看吧。
基础框架
基础框架决定了整个前端业务框架的基础，比如你是用react还是vue，代码组织方式是用微前端还是单页面应用还是多页面应用，通常这是我们业务的起点，对开发的影响较大。
工具支撑
这里面涉及的东西就比较零碎。首先就是我们的业务开发脚手架，可以帮助我们快速初始化应用，简单点可以提供一堆现成的模版，复杂一点的可以提供一些可选项，可以比较快速地实现代码的服用。开发效率工具和运行时效率工具都可以算到这里面，运行时的效率工具比如jsapi之类的也可以算到这里。
组件
这一层和运行时工具有点类似，都是对一些现有东西的封装，只不过更偏向于ui层，公用的和自己做的其实都算，比如自己开发的业务组件库和 antd 之类的公有组件库，都是提高效率不可或缺的一环。
打包构建
这个就是上线和本地开发必备的一环了，常见的就是webpack，babel，less等等，功能性插件等等
线上基础设施
这个是我们线上代码稳定运行的保证，比如cdn、oss、流水线，包管理仓库日志监控等等。
