Javascript 无法使用Wordpress的Webpack 4中的MinicsExtractPlugin加载样式

我正在使用Webpack4进行Wordpress主题开发。我已经将webpack.config.js配置为从js文件中提取css，并将其加载到单独的文件中。但是这些样式并没有被加载，或者作为单独的css文件加载。 webpack.config.js

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

module.exports = {
  context: __dirname,
  entry: {
    userSide: "./js/public.js",
    adminSide: "./js/admin.js"
  },
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "[name].js"
  },
  mode: "development",
  devtool: "source-map",
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: "babel-loader"
      },
      {
        test: /\.(png|svg|jpg|jpeg|gif)$/,
        use: [
          {
            loader: "file-loader",
            options: {
              outputPath: "dist/images",
              name: "[name].[ext]"
            }
          }
        ]
      },
      {
        test: /\.s?css$/,
        use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"]
      }
    ]
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: "[name].[contenthash].css"
    })
  ]
};

每当我运行

npm run dev

时，就会在本地目录中创建css文件，但不会显示网站中的更改。

---

请帮助

这是我如何配置我的网页包

您可以使用我的设置来查看它是否适合您

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

添加到插件部分：

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

行政及规则组

{
   "test":"/\\.scss$/",
   "use":[
      "style-loader",
      "MiniCssExtractPlugin.loader",
      {
         "loader":"css-loader",
         "options":{
            "minimize":true,
            "sourceMap":true
         }
      },
      {
         "loader":"sass-loader"
      }
   ]
},

此外，您可能需要使用html网页包将css注入html