工程化
前端工程化是一种高层次思想而不是某种技术，所谓前端工程化就是将前端项目当成一项系统工程进行分析、组织和构建从而达到项目结构清晰、分工明确、团队配合默契、开发效率提高的目的。而模块化和组件化是为工程化思想下相对较具体的开发方式，因此可以简单的认为模块化和组件化是工程化的表现形式。
前端工程化分为三个大阶段
- 技术选型
- 构建优化
- 模块化开发，组件化开发
模块化
模块化主要体现的是一种分而治之的思想。分而治之是软件工程的重要思想，是复杂系统开发和维护的基石。
模块化的优势
- 提高维护性
- 提高代码复用率
- 方便依赖关系的管理
- 可以避免变量污染，命名冲突
三种模块化规范
1. CommonJS
根据 CommonJS 规范，一个单独的文件就是一个模块。每一个模块都是一个单独的作用域，也就是说，在该模块内部定义的变量，无法被其他模块读取，除非定义为global对象的属性。
2. AMD
AMD 即 Asynchronous Module Definition，中文名是异步模块定义的意思。AMD规范通过 define 方法去定义模块，通过require方法去加载模块。RequireJS 实现了这种规范。
3. CMD
CMD 即 Common Module Definition 通用模块定义，是 SeaJS 在推广过程中对模块定义的规范化产出。
模块化规范： https://blog.csdn.net/fu983531588/article/details/89309242
组件化
- 页面上的每个独立的、可视/可交互区域视为一个组件
- 每个组件对应一个工程目录,组件所需的各种资源都在这个目录下就近维护
- 由于组件具有独立性，因此组件与组件之间可以 自由组合
- 页面只不过是组件的容器，负责组合组件形成功能完整的界面
- 当不需要某个组件，或者想要替换组件时，可以整个目录删除/替换
组件化将页面视为一个容器，页面上各个独立部分例如：头部、导航、焦点图、侧边栏、底部等视为独立组件，不同的页面根据内容的需要,去盛放相关组件即可组成完整的页面。
PS： 模块化和组件化一个最直接的好处就是复用,同时我们也应该有一个理念,模块化和组件化除了复用之外还有就是分治,我们能够在不影响其他代码的情况下按需修改某一独立的模块或是组件,因此很多地方我们及时没有很强烈的复用需要也可以根据分治需求进行模块化或组件化开发。
