webpack 打包 css（二）

在 webpack.config.js 里

1. 添加 ：

const MiniCssExtractPlugin = require('mini-css-extract-plugin');

2. 用 MiniCssExtractPlugin.loader 替换 style-loader

module: { rules: [ { test: /\.css$/, use: [ { loader: MiniCssExtractPlugin.loader, options: { publicPath: "dist/styles/", }, }, "css-loader", ], } ] },

3. 添加 plugins：

plugins: [ new MiniCssExtractPlugin({ filename: "index.css", chunkFilename: "[id].css", }) ],

在 terminal 里运行

4. npm install mini-css-extract-plugin -D

5. 在 src 目录下创建 index.css

6. 在 index.js 里： require('./css/index.css')

7. 运行 webpack 编译成功。