webpack 基础到构建（四）

九，HTML压缩
    ---之前自动生成html文件时，我们使用了html-webpack-plugin，可想而知，插件是负责更为复杂的任务或功能的，所以，这里我们也还是配置html-webpack-plugin插件即可，

通过monify设置html压缩设置，以上为两种最常用选项，当然还有一些比如标点符号设置等

十，Js压缩
    --生产环境下会自动压缩js代码，so，直接将webpack.config.js中的Mode改为'production'，这里是webpak在生产环境下都已经默认配置好了，具体的操作，可自行查百度。

十一，Js语法检测
    ---主动去拥抱标准，后面也会享受标准；
    ---需要loader： eslint-laoder 和 eslint
    ---需要包：eslint-config-airbnb-base eslint-plugin-import
    ---检测文件条件：1，代码编辑区里的文件  2，js代码

    11.1 配置webpack设置

配置webapck中的eslint相关

    11.2 配置eslint-config，在package.js中添加eslintConfig属性

选择使用airbnb代码风格，这里后续还有一些配置哦

十二，Js兼容性处理
    ---需要loader： babel-loader  @babel/core @babel/preset-env 【只负责基本的js兼容性处理】；
    ---还需下载  @babel/polyfill 【引入使用，在代码编辑区的js文件内使用import引入】兼容处理更为高级的js兼容，可测试promise，但是其本身也存在问题；
    ---so，实际体验肯定是按需加载，不要profill的全部加载，所以，这里也可以下载core-js，这里可自行选择，当然推荐core-js.
    ---值得注意的是：这里的polyfill和cosejs是想矛盾的，通过测试，也表明二者不可同时存在；

    12.1 配置相关

babel配合core-js处理js兼容

测试打包后，会发现打包速度已经很慢了，so，后续可能需要重新构建一次，好好看看为什么这么慢，后面也会专门出一系列性能优化的小东西。。。