持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第6天，点击查看活动详情
什么是前端工程化？
工程化即系统化、模块化、规范化，旨在提高前端系统的生产效率。
解决了什么问题？
工程化解决的问题是，如何去提高编码、测试、维护阶段的生产效率。
前端工程化的实践
构建编译
比如打包工具：
最早的gulp，也叫做任务运行器（task runner）。就是对单个文件使用对应的编译规则，但也正是因此，导致难以进行全局优化。
到后面的webpack，根据不同的依赖文件，形成依赖图，并且基于此我们可以进行优化，比如做treeshaking等。
再到vite，采用了no bundle的形式，这个形式也是因为浏览器支持esm而推出的，解决了项目过大时，webpack开发环境打包速度之慢。
格式化
提到了打包工具的编译构建，同时还有在我们编写代码时候的一系列lint，格式化工具。
比如eslint对于js代码的格式化、tsc对于ts类型的检查、stylelint对于css文件的检查
CI/CD
持续集成，提交你的分支之后，你的代码通过流水线检查，并且构建，目的是让产品可以快速迭代，同时还能保持高质量，保证团队开发人员提交代码的质量，减轻了软件发布时的压力；
持续部署，结合代码托管平台使用，将不同tag的主分支快速发布到生产环境。对于前后端，测试，运维人员都能实现敏捷迭代，快速回滚。
代码管理
multirepo（一个项目一个仓库） vs monorepo（多个项目一个仓库）
monorepo解决问题：
1.实现了多个项目间的代码复用。
2.项目基建成本的降低，比如：无需多个项目多个CI等发布流程，使用同一套lint规范等等。
3.解决了多项目间的调试，比如a项目依赖b项目，若是monorepo架构，省去了npm link的操作。
4.解决了依赖管理问题，进行多项目间的公共依赖提取。
WIP...
总结：
前端工程化就是处理前端代码的一系列工具链集合，这些工具会对你的代码进行一系列处理。比如编译构建、ci/cd、代码托管、静态分析、格式化等。
