Can't use version upper than 2.5.0

[mdellanave]

Bug report

I can't compile with a version upper than 2.5.0 because of this error

> build-for-dev: STARTED
> build-for-dev: TypeError: Cannot read properties of undefined (reading 'loader')
> build-for-dev: at Object.<anonymous> (c:\PROJECTS\***\webpack.config.babel.js:29:32)
> build-for-dev: at Module._compile (node:internal/modules/cjs/loader:1105:14)
> build-for-dev: at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
> build-for-dev: at Module.load (node:internal/modules/cjs/loader:981:32)
> build-for-dev: at Function.Module._load (node:internal/modules/cjs/loader:822:12)
> build-for-dev: at Module.require (node:internal/modules/cjs/loader:1005:19)
> build-for-dev: at require (node:internal/modules/cjs/helpers:102:18)
> build-for-dev: at Object.<anonymous> (c:\PROJECTS\***\gulpfile.js:4:23)
> build-for-dev: at Module._compile (node:internal/modules/cjs/loader:1105:14)
> build-for-dev: at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
> build-for-dev: FAILED

Actual Behavior

If I use the specific 2.5.0 version, build task runs without errors.

Expected Behavior

I would like to update the package and still build the project

How Do We Reproduce?

This is the webpack rule where the error happens

    {
       test: /\.(sa|sc|c)ss$/,
       use: [
         MiniCssExtractPlugin.loader,
         'css-loader',
         {
           loader: 'sass-loader',
           options: {
             // Prefer `dart-sass`
             implementation: require.resolve('sass'),
             sourceMap: true,
             sassOptions: {
               outputStyle: 'compressed',
             },
           },
         },
       ],
     },

results of npx webpack-cli info

System:
OS: Windows 10 10.0.19044
CPU: (8) x64 Intel(R) Core(TM) i7-4712HQ CPU @ 2.30GHz
Memory: 3.78 GB / 15.91 GB
Binaries:
Node: 16.15.1 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.17 - ~\AppData\Roaming\npm\yarn.CMD
npm: 8.12.1 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: 103.0.5060.114
Edge: Spartan (44.19041.1266.0), Chromium (103.0.1264.62)
Internet Explorer: 11.0.19041.1566
Packages:
babel-loader: ^8.2.5 => 8.2.5
clean-webpack-plugin: ^4.0.0 => 4.0.0
copy-webpack-plugin: ^11.0.0 => 11.0.0
css-loader: ^6.7.1 => 6.7.1
file-loader: ^6.2.0 => 6.2.0
html-loader: ^4.1.0 => 4.1.0
html-webpack-plugin: ^5.5.0 => 5.5.0
ignore-loader: ^0.1.2 => 0.1.2
json5-loader: ^4.0.1 => 4.0.1
postcss-loader: ^7.0.1 => 7.0.1
resolve-url-loader: ^5.0.0 => 5.0.0
sass-loader: ^13.0.2 => 13.0.2
url-loader: ^4.1.1 => 4.1.1
webpack: ^5.73.0 => 5.73.0
webpack-cli: ^4.10.0 => 4.10.0
webpack-dev-server: ^4.9.3 => 4.9.3
webpack-merge: ^5.7.3 => 5.8.0
worker-loader: ^3.0.8 => 3.0.8

[alexander-akait]

Sorry, I can't help, bug in webpack.config.babel.js file

TypeError: Cannot read properties of undefined (reading 'loader')

This is not a webpack problem/bug, this is problem with JS itself (maybe bug in babel? or maybe you update babel and babel generates other code, not sure).

Anyway if you want to help please provide reproducible test repo