npm run bundle 打包失败---Module build failed (from ./node_modules/css-loader/dist/cjs.js)

伍成仁
2023-12-01

npm run bundle 打包失败
因为是自学的,然后在配置文件

const path = require('path');
module.exports = {
  entry: './src/index.js',//入口文件
  // 配置文件的模块
  module: {
    rules: [
      {
        test: /\.(png|jpe?g|gif)$/,
        use: {
          loader: 'file-loader',
          options: {
            // name:'[name]_[hash].[ext]',
            // outputPath:'images/',
          }
        }
      },
      {
        test: /\.scss$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options:{
              importLoaders:2,
              modules:2,//配置成了2当时也不知道是怎么了。。。几乎导致自己学习兴趣降低为0
            }
          },
          'sass-loader',
          'postcss-loader'
        ]
      }
    ]
  },
  output: {
    filename: "bundle.js",//打包输出的js的文件
    path: path.resolve(__dirname, 'dist')//打包所在的文件夹
  }
}

ERROR in ./src/index.scss (./node_modules/css-loader/dist/cjs.js??ref--5-1!./node_modules/sass-loader/dist/cjs.js!./node_modules/postcss-loader/src!./src/index.scss)
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
ValidationError: Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
 - options.modules should be one of these:
   boolean | "local" | "global" | "pure" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }
   -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
   Details:
    * options.modules should be a boolean.
    * options.modules should be one of these:
      "local" | "global" | "pure"
    * options.modules should be an object:
      object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }
    at validate (F:\2020\learnWebPack\node_modules\css-loader\node_modules\schema-utils\dist\validate.js:98:11)
    at Object.loader (F:\2020\learnWebPack\node_modules\css-loader\dist\index.js:36:28)
 @ ./src/index.scss 2:26-184
 @ ./src/index.js

好了。收收心,仔细看看报错信息,不难发现是Module build failed (from ./node_modules/css-loader/dist/cjs.js):模块构建失败,来自…css-loader.
options.modules should be one of these:
boolean | “local” | “global” | “pure” | object { compileType?, auto?, mode?,
选项模块应该来自于以下选项。怎么可能有数字2呢????

 类似资料: