0x.00 前言
在用了5章篇幅 ElementUI源码学习:从零开始搭建Vue组件库汇总 讲解了如何编写一个组件、发布npm以及生成展示文档之后。接下来将分析Element项目的代码结构，学习其工程化思想。
前端开发早已从瘦客户端（thin client）架构/中心服务器（server-centric）架构进入到胖客户端（fat client）架构，各家技术百花齐放，让人目不暇接，直呼学不动了！伴随项目开发的复杂度日益增高，开发中需要直面各种问题： 开发效率、产品质量、多人协作等。
前端工程化是什么？
前端工程化 就是为了应对上述问题，把软件工程相关的方法和思想应用到前端日常开发中，以 系统化的、规范化的、可度量的方法用于前端项目的开发、运行和维护等阶段，从而提高开发效率、提高产品质量、减少不必要的重复工作时间、降低开发难度/风险、降低企业成本(降本增效)。
如今前端项目的开发、构建、部署等主要环节，涉及了项目构建、代码开发、分支管理、自动化测试、持续集成、项目部署、性能等内容。如何用工程化的思想让开发更加系统化、标准化？主要分为 模块化（组件化）、规范化、自动化 等多个方面。
1️⃣ 模块化
项目按照其功能/业务拆分成相互独立的模块，可以独立运行。每个模块只包含与其功能相关的内容，模块之间通过接口调用，降低模块间的耦合。 将一个大的系统模块化之后，每个模块都可以被高度复用。模块不等于功能，一个功能可能包含多个模块(功能 > 模块)。
模块化让项目便于依赖管理、利于性能优化、提高可维护性。 各技术实现方案如下：
- JS的模块化(CommonJS、 AMD、 CMD、UMD、ES6 Module)
- CSS的模块化(BEM 命名规范、CSS Module、CSS In JS)
- 资源模块化(webpack loaders)
2️⃣ 组件化
组件化是为了解决项目代码重复问题，将其拆分成多个独立的组件给不同的功能使用，提高系统的代码重用（复用）性和易维护性。
