Cannot read property 'sassLoader' of undefined

Question

this is my sass loader settings in webpack config. Looks like sass loader is ok

{
        test: /\.scss$/,
        exclude: '/node_modules/',
        use: [
          'style-loader',
          'css-loader',
          'sass-loader',
        ],
      }

in terminal i get error because of can not compile my sass file i have changed my settings in sass loader lots of times but always get this error.

ERROR in ./src/style/main.scss (./node_modules/css-loader!./node_modules/sass-loader!./src/style/main.scss)
Module build failed: TypeError: Cannot read property 'sassLoader' of undefined
    at getLoaderConfig (E:\projects\new\doit\node_modules\sass-loader\index.js:389:39)
    at Object.module.exports (E:\projects\new\doit\node_modules\sass-loader\index.js:42:23)
 @ ./src/style/main.scss 4:14-117 13:2-17:4 13:116-17:3 14:20-123
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:9000 webpack/hot/dev-server ./src/main.js

Answer 1

I just ran into this problem upgrading from Webpack 3.x to 4.x.

In my case I had to update to the latest version of all loaders I was using (style-loader, css-loader, sass-loader and babel-loader).