webpack--生产环境的配置

处理图片：url--loader：

 处理HTML文件，用插件：

 产生的问题：HTML中的图片无法处理，加loader：

 其他文件的统一处理：file-loader （原样输出）

 

 

CSS文件从js文件中提取出来

MiniCSSExtroctorPlugin,两处使用，plugin中new，并且用内部loader取代style-loader

 

 

CSS兼容性处理，用loader处理：

postcss-loader, postcsspreset-env

 

 

CSS压缩：用插件处理

引入后 new就可以用了

 

语法检查：

只检查js,                        exclude：XX排除第三方库不检查

需要告诉eslint，使用什么风格的语法--airbnb，依赖三个插件。下载好后在package.json中进行配置：

 

option：fix：{true}  自动修复

 

 JS兼容性处理：

最终采取1、3两种方法结合 1=》@，3=》按需加载

 

 要先进行语法检查eslint 再进行兼容性处理 babel，可以在loader：‘eslint-loader’前面加上enforce:'pre',代表优先执行。

 

 js压缩、HTML 压缩