前言

先说一下extract-text-webpack-plugin 这个插件已经被废弃了，官网也说明了，建议不要再使用了。

取而代之的是mini-css-extract-plugin，只支持webpack5及以上版本，版本低得朋友可以考虑升级下webpack，如果版本太低了在v3或以下，那还是使用extract-text-webpack-plugin把

使用方法

1. 安装mini-css-extract-plugin

> npm install --save-dev mini-css-extract-plugin

2. 在webpack.config.js中配置loader和插件

const MiniCssExtractPlugin = require("mini-css-extract-plugin");
module.exports = {
    module: {
        rules: [
            {
                test: /\.css$/i,
                use: [MiniCssExtractPlugin.loader, "css-loader","postcss-loader"],
            },
            {
                test: /\.less$/i,
                use: [MiniCssExtractPlugin.loader, "css-loader","postcss-loader","less-loader"]
            },
        ],
    },
    plugins: [
        new MiniCssExtractPlugin({
            filename: "[name].[fullhash].css",
            chunkFilename: "[id].[hash].css"
        })
    ],

官网文档

www.npmjs.com/package/min…