Webpack基本理解

Webpack项目构建工具

构建工具的功能：

代码转换：ES6编译成ES5、SCSS 编译成 CSS 等。
文件优化：压缩 JavaScript、CSS、HTML 代码，压缩合并图片等。
模块合并：在采用模块化的项目里会有很多个模块和文件，需要构建功能把模块分类合并成一个文件。
代码分割：提取多个页面的公共代码、提取首屏不需要执行部分的代码让其异步加载。
自动刷新：监听本地源代码的变化，自动重新构建、刷新浏览器。
代码校验：在代码被提交到仓库前需要校验代码是否符合规范，以及单元测试是否通过。

常见的项目构建工具

grunt、gulp、fis3(百度) ：

1. 主要针对的是非模块化打包
2. 通过扩展插件也进行模块化打包
3. 构建打包能力不足

webpack核心对象: https://webpack.docschina.org/concepts/loaders/