score:395

Accepted answer

You should change loaders to rules in webpack 4:

change:

loaders 

to:

rules

source: Loaders

Example:

module.exports = {
  module: {
    rules: [
      { test: /\.css$/, use: 'css-loader' },
      { test: /\.ts$/, use: 'ts-loader' }
    ]
  }
};

score:2

Working for me below webpack.config.js

module.exports = {
    entry: [
        '.src/index.js'
    ],
    output:{
        path: __dirname,
        filename: 'app/js/main.js'
    },
    module:{
        rules: [
          { test: /\.css$/, use: 'css-loader' },
          { test: /\.ts$/, use: 'ts-loader' }
        ]
    }
}

score:3

Above given answers are working but we can resolve this issue by changing webpack and webpack-dev-server version to

"webpack": "3.8.1",
"webpack-dev-server": "2.9.4"

It can also solve the issue. Hope it will help.

score:4

You should use the migration utility to migrate your webpack config files, it worked for me.

The migration documentation is also useful.

score:16

Use rules in webpack 4 instead of loaders.

https://webpack.js.org/concepts/loaders/


Related Query

More Query from same tag