Issue with css-loader 4.1.1

[nstuyvesant]

• Operating System: macOS
• Node Version: 14.7.0
• NPM Version: 6.14.7
• webpack Version: 4.44.1
• mini-css-extract-plugin Version: 0.9.0

Expected Behavior

This will work:

        {
          test: /\.(sa|sc|c)ss$/,
          include: [
            path.resolve(__dirname, 'client/app/app.scss')
          ],
          use: [
            // In development, CSS is in app.bundle.js. In production, CSS is in app.[hash].css.
            MiniCssExtractPlugin.loader,
            {
              loader: 'css-loader', // https://github.com/webpack-contrib/css-loader
              options: {
                modules: {
                  exportOnlyLocals: true
                }
              }
            },
            { // Shrinks CSS file by 12K
              loader: 'postcss-loader', // https://github.com/postcss/postcss-loader
              options: {
                plugins: () => [autoprefixer()]
              }
            },
            {
              loader: 'sass-loader', // https://github.com/webpack-contrib/sass-loader
            }
          ]
        }

Actual Behavior

ERROR in ./client/app/app.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: 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 has an unknown property 'type'. These properties are valid:
   object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }
    at validate (/Users/nates/dev/shy/node_modules/schema-utils/dist/validate.js:96:11)
    at Object.loader (/Users/nates/dev/shy/node_modules/css-loader/dist/index.js:36:28)
    at /Users/nates/dev/shy/node_modules/webpack/lib/NormalModule.js:316:20
    at /Users/nates/dev/shy/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /Users/nates/dev/shy/node_modules/loader-runner/lib/LoaderRunner.js:233:18
 @ ./client/app/app.module.js 70:0-20

Code

See above

How Do We Reproduce?

Install [email protected] and use Webpack configuration provided above.

[alexander-akait]

type: 'icss', is not implemented and it should be on css-loader, you can find an issue in css-loader repo

[alexander-akait]

Ref: webpack-contrib/css-loader#1134

[nstuyvesant]

The error occurs without type: 'icss'. I've updated my example above. In fact, if you even have a modules under the options for css-loader, there's an error.

[alexander-akait]

Because it is not implemented yet