webpack 原理及工作流程

webpack 是一个前端项目构建工具，使用webpack 可以把前端当成一个工程来开发，而且能够更好的把前端的各类资源统一管理，编译，打包

• 它是一个编辑工具，可以通过各种插件将基于node.js ,sass,less 编写代码编译成能够运行在前端浏览器的javascript  

和css

• 它是一个打包工具，可以将前端所有的资源打包到一个dundle.js 中

webpack工作流程：

1. 初始化参数，从配置文件和shell语句中读取与合并参数，得出最终的参数
2. 开始编译：用上一步得到的参数初始化编译对象，加载所有配置的插件，执行对象的run 方法开始执行编译
3. 确定入口：根据配置中的 entry 找出所有的入口文件
4. 编译模块：从入口文件出发，调用所有配置的 loader对模块进行翻译，包括该模块依赖的模块
5. 完成模块编译，通过配置的loader翻译完所有模块后，得到每个模块被翻译后的最终内容以及他们之间的依赖关系
6. 输出资源：根据入口和模块之间的依赖关系，组成一个个包含多个模块的chunk,再把每个chunk转换为一个单独的文件加入到输出列表
7. 输出完成：在确定好输出内容后，根据配置确定输出的路径和文件名，把文件内容写入到文件系统