Css-loader: options should NOT have additional properties

[tapz]

• Operating System: MacOS
• Node Version:
• NPM Version: yarn 1.12.3
• webpack Version: 4.27.1
• css-loader Version: 2.0.1

Expected Behavior

No errors.

Actual Behavior

ERROR in ./node_modules/react-spinkit/css/base.css
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
ModuleBuildError: Module build failed (from ./node_modules/css-loader/dist/cjs.js):
ValidationError: CSS Loader Invalid Options

options should NOT have additional properties

Removing all options helps.

Code

{ 
        test: /\.(scss|css)?$/,
        use: ExtractTextPlugin.extract({
          use: [{
            loader: 'css-loader',
            options: {
              include: path.join(__dirname, 'src', 'styles') 
            }
          }, {
            loader: 'sass-loader',
            options: {
              include: path.join(__dirname, 'src', 'styles') 
            }
          }],
          // use style-loader in development
          fallback: 'style-loader'
        })
      }, { 

  // additional code, HEY YO remove this block if you don't need it

How Do We Reproduce?

Update css-loader from 1.0.1 to 2.0.1 and use the webpack config above.

[noelblaschke]

Hey @tapz,

include seems not to be a possible option for css-loader 2.0.1: https://github.com/webpack-contrib/css-loader/tree/v2.0.1#options

Try to move your include option to the Rule object (https://webpack.js.org/configuration/module/#rule-include). Does it help?

[alexander-akait]

Answer above https://github.com/webpack-contrib/css-loader/issues/873#issuecomment-447643473

[7iomka]

Hey @tapz,

include seems not to be a possible option for css-loader 2.0.1: https://github.com/webpack-contrib/css-loader/tree/v2.0.1#options

Try to move your include option to the Rule object (https://webpack.js.org/configuration/module/#rule-include). Does it help?

Hi, Please help me, how I do that for my case?
My code is:

{
  test: /\.scss$/,
  use: ExtractTextPlugin.extract({
    publicPath: '../',
    fallback: 'style-loader',
    use: [
      {
        loader: 'css-loader',
        options: {
          sourceMap: false,
          includePaths: [path.resolve(__dirname, 'node_modules')], // <--------------
        },
      },
      {
        loader: 'postcss-loader',
        options: {
          sourceMap: false,
          plugins: postCssPlugins(env),
        },
      },
      ...
  })
}