[Bug] Error - Webpack is outdated

[Iaaaaan96]

Version

1.3

Reproduction link

https://jsbin.com/sukagelihi/edit?html,console,output

Operating System

Windows 11

Device

PC

Browser & Version

Mozilla

Steps to reproduce

npm install
npm run

What is expected?

To build and compile the project

What is actually happening?

Giving issues :

Error: ./src/assets/css/demo.css
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
TypeError: Cannot read properties of undefined (reading 'tapAsync')
at ExternalModuleFactoryPlugin.apply (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:59:39)
at C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\webpack\lib\ExternalsPlugin.js:30:63
at SyncHook.eval [as call] (eval at create (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:19:10), :7:1)
at SyncHook.lazyCompileHook (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\Hook.js:154:20)
at C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:665:23
at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), :6:1)
at AsyncSeriesHook.lazyCompileHook (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\Hook.js:154:20)
at Compiler.compile (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:662:28)
at Compiler.runAsChild (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:328:8)
at Object.pitch (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\mini-css-extract-plugin\dist\loader.js:121:17)

Error: ./src/styles.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
TypeError: Cannot read properties of undefined (reading 'tapAsync')
at ExternalModuleFactoryPlugin.apply (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:59:39)
at C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\webpack\lib\ExternalsPlugin.js:30:63
at SyncHook.eval [as call] (eval at create (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:19:10), :7:1)
at SyncHook.lazyCompileHook (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\Hook.js:154:20)
at C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:665:23
at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), :6:1)
at AsyncSeriesHook.lazyCompileHook (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\Hook.js:154:20)
at Compiler.compile (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:662:28)
at Compiler.runAsChild (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:328:8)
at Object.pitch (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\mini-css-extract-plugin\dist\loader.js:121:17)

Error: ./src/assets/sass/now-ui-kit.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
TypeError: Cannot read properties of undefined (reading 'tapAsync')
at ExternalModuleFactoryPlugin.apply (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\webpack\lib\ExternalModuleFactoryPlugin.js:59:39)
at C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\webpack\lib\ExternalsPlugin.js:30:63
at SyncHook.eval [as call] (eval at create (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:19:10), :7:1)
at SyncHook.lazyCompileHook (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\Hook.js:154:20)
at C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:665:23
at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), :6:1)
at AsyncSeriesHook.lazyCompileHook (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\node_modules\tapable\lib\Hook.js:154:20)
at Compiler.compile (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:662:28)
at Compiler.runAsChild (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules@angular-devkit\build-angular\node_modules\webpack\lib\Compiler.js:328:8)
at Object.pitch (C:\Users\Pablo\Desktop\RidingWavesCode\node_modules\mini-css-extract-plugin\dist\loader.js:121:17)

---

Solution

Additional comments