谈谈你对前端工程化的理解？

前端工程化是指使用软件工程的技术和方法来进行前端的开发流程、技术、工具、经验等规范化、标准化。

主要包含以下几个方面:

模块化

简单来说，模块化就是将一个大文件拆分成相互依赖的小文件，再进行统一的拼装和加载。

JS的模块化:import引入规范化，Webpack + Babel将所有模块打包成一个文件同步加载，也可以打包成多个chunk异步加载。
CSS模块化:SASS、LESS等预处理器实现了CSS的文件拆分,CSS Modules来管理css。原理:通过在每个 class 名后带一个独一无二的 hash 值，这样就不有存在全局命名冲突的问题了。
资源的模块化:统一处理CSS和图片等资源，用loader对各种资源做各种事情，webpack(src, config)使项目结构更加清晰。

组件化≠模块化。

模块化只是在文件层面上，对代码或资源的拆分；而组件化是在设计层面上，对UI（用户界面）的拆分。

页面上所有的东西都是组件。页面是个大型组件，可以拆成若干个中型组件，然后中型组件还可以再拆，拆成若干个小型组件，小型组件也可以再拆，直到拆成DOM元素为止。DOM元素可以看成是浏览器自身的组件，作为组件的基本单元。

TIP

传统前端框架/类库的思想是先组织DOM，然后把某些可复用的逻辑封装成组件来操作DOM，是DOM优先；

而组件化框架/类库的思想是先来构思组件，然后用DOM这种基本单元结合相应逻辑来实现组件，是组件优先。这是两者本质的区别。

规范化其实是工程化中很重要的一个部分，项目初期规范制定的好坏会直接影响到后期的开发质量。

前端工程化的很多脏活累活都应该交给自动化工具来完成。需要秉持的一个理念是:任何简单机械的重复劳动都应该让机器去完成。