Webpack项目构建工具
构建工具的功能:
代码转换:ES6编译成ES5、SCSS 编译成 CSS 等。
文件优化:压缩 JavaScript、CSS、HTML 代码,压缩合并图片等。
模块合并:在采用模块化的项目里会有很多个模块和文件,需要构建功能把模块分类合并成一个文件。
代码分割:提取多个页面的公共代码、提取首屏不需要执行部分的代码让其异步加载。
自动刷新:监听本地源代码的变化,自动重新构建、刷新浏览器。
代码校验:在代码被提交到仓库前需要校验代码是否符合规范,以及单元测试是否通过。
常见的项目构建工具
grunt、gulp、fis3(百度) :
- 主要针对的是非模块化打包
- 通过扩展插件也进行模块化打包
- 构建打包能力不足