第一章 入门

1、提取css文件报错Cannot find module 'webpack/lib/Chunk'

• 重装webpack webpack-cli
• 修改plugins配置

 plugins: [
        new ExtractTextPlugin({
            filename: `[name]_[md5:contenthash:hex:8].css`
        })
    ]

2、webpack4废弃了minimize

压缩css文件使用optimize-css-assets-webpack-plugin插件

第二章 配置

1、output.path和output.publicPath的区别

• path是webpack所有文件的输出的路径，必须是绝对路径，比如：output输出的js,url-loader解析的图片，HtmlWebpackPlugin生成的html文件，都会存放在以path为基础的目录下
• publicPath 并不会对生成文件的路径造成影响，主要是对你的页面里面引入的资源的路径做对应的补全，常见的就是css文件里面引入的图片
  参考： https://blog.csdn.net/qq_39207948/article/details/80631435

第三章 实战

1、es6

不加版本直接安装babel-core和babel-loader：
If you'd like to use Babel 6.x ('babel-core'), you should install 'babel-loader@7
解决：

npm i --save-dev babel-loader@7.1.5

原因：babel-loader和babel-core版本不对应所产生的，

• babel-loader 8.x对应babel-core 7.x
• babel-loader 7.x对应babel-core 6.x

2、typscript学习推荐书籍

《Learning TypeScript中文版》

配置方法：

• 安装ts编译插件

  npm i -D typescript awesome-typescript-loader

• 新建配置文件tsconfig.json

 {
    "compilerOptions": {
        "module": "CommonJS",
        "target": "es5",
        "importHelpers": true
    }
}

• 修改webpack.config.js

resolve: {
        extensions: ['.ts', '.js']
 }
module: {
    rules: [
            {
                test: /\.ts$/,
                use: "awesome-typescript-loader"
            }
        ]
    }

3、scss学习推荐书籍

《Sass与Compass实战》

4、安装vue-loader和vue-template-compiler后报错

vue-loader requires @vue/compiler-sfc to be present in the dependency tree.
解决：

• 把安装版本改为14的

  npm i -D vue-loader@14

链接
http://www.baidu.com

5、web-webpack-plugin和html-webpack-plugin的区别

web-webpack-plugin用法参考，资料很少，后期找到再补充，有一个多页面营业的功能，用的会多一点
https://www.npmjs.com/package/web-webpack-plugin
html-webpack-plugin一般都用这个组件的多，用法网上很多