NodeJS TypeError:this.getOptions不是Object.loader中的函数

hiz5n14c  于 2023-06-22  发布在  Node.js
关注(0)|答案(1)|浏览(118)

https://i.stack.imgur.com/IEmJ3.png)这里是它的文本

ERROR in ./src/components/App.scss
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
TypeError: this.getOptions is not a function
    at Object.loader

当我完成npm run build时,我得到了这个错误消息。
下面我已经粘贴了我的Webpack配置,这里testLoader是自定义加载器错误不是因为testLoader,而是因为我已经导入了一个css文件到我的App.js的React(它基本上是给错误时,我有一个css文件导入)
https://i.stack.imgur.com/wWDtV.png)。如果有人知道如何解决,请告诉我。
这里是代码,如果图像有麻烦,在看到图像。

const merge = require("webpack-merge");
const common = require("./webpack.common.js");
const path = require("path");
const CleanWebpackPlugin = require("clean-webpack-plugin");
const OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const ManifestPlugin = require("webpack-manifest-plugin");
const BundleAnalyzerPlugin =
  require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
const webpack = require("webpack");
const enableBundleAnalyzer = process.env.ENABLE_ANALYZER === "true";

const loadersPath = path.resolve(__dirname, "../loaders");

module.exports = merge(common, {
  mode: "production",
  devtool: "source-map",
  module: {
    rules: [
      {
        test: /\.(js)$/,
        use: { loader: path.resolve(loadersPath, "testLoader.js") },
      },
      {
        test: /\.s?(a|c)ss$/,
        use: [{ loader: "css-loader" }, { loader: "sass-loader" }],
      },
    ],
  },
  optimization: {
    splitChunks: {
      chunks: "all",
    },
    runtimeChunk: false,
  },
  plugins: [
    new CleanWebpackPlugin([path.resolve(__dirname, "../dist")], {
      root: process.cwd(),
      verbose: true,
      dry: false,
    }),
    new OptimizeCssAssetsPlugin(),
    new MiniCssExtractPlugin({
      filename: "[name].[hash:8].css",
      chunkFilename: "[id].[hash:8].css",
    }),
    new ManifestPlugin(),
    new BundleAnalyzerPlugin({
      analyzerMode: enableBundleAnalyzer === true ? "static" : "disabled",
      openAnalyzer: true,
    }),
  ],
});

我看过一些帖子,他们说这是因为同一个加载器执行了两次,但这不是我的情况。

j8ag8udp

j8ag8udp1#

从屏幕截图来看,我假设您使用的是Webpack v4
要使用最新版本的css-loader,需要webpack@5

相关问题