Error: options/query provided without loader. Webpack 2.2.0-rc.3

Question

I've updated webpack from rc2 to rc3 and since that I can not start my project via npm start I get the error like that

> webpack-dev-server

Error: options/query provided without loader (use loader + options) in {
  "test": {},
  "exclude": {},
  "use": "file-loader",
  "query": {
    "name": "[name].[ext]"
  }
}

Here is my config

  module: {
    rules: [
      {
        test: /\.html$/,
        exclude: /node_modules/,
        use: 'file-loader',
        query: {
          name: '[name].[ext]',
        },
      },
      {
        test: /\.s?css$/,
        exclude: /node_modules/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1,
              modules: true,
              localIdentName: '[name]__[local]_[hash:base64:5]',
            },
          },
          'sass-loader',
          'sass-resources-loader',
          'postcss-loader',
        ],
        query: {
          modules: true,
        },
      },
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        use: [
          'babel-loader',
        ],
      },
    ],
  },

rollback to rc2 doesnt resolve the problem.. I believe that the problem is in rc3 because I have another project which had rc2 and could start. It have broken right after update webpack to rc3

Answer 1

You need to edit your config because Webpack 2 has changed its schema for declaring loaders.

Refactor this part:

{
    test: /\.html$/,
    exclude: /node_modules/,
    use: 'file-loader',
    query: {
      name: '[name].[ext]',
    },
},

to this:

{
    test: /\.html$/,
    exclude: /node_modules/,
    use: [
        {
            loader: 'file-loader',
            query: {
                name: '[name].[ext]'
            }
        }
    ]
},

Apply this transformation to other loaders you're declaring and it should work :)