Trying to start Storybook in a NX monorepo, but getting this error when trying these commands:

nx run projectName:storybook nx storybook projectName :

9% setup compilation SourceMapDevToolPlugin
C:\Users\userName\Documents\Git\bft3\node_modules\@angular-devkit\build-angular\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:143
                        throw new TypeError(
                              ^

TypeError: The 'compilation' argument must be an instance of Compilation
    at Function.getCompilationHooks (C:\Users\userName\Documents\Git\bft3\node_modules\@angular-devkit\build-angular\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:143:10)
    at SourceMapDevToolModuleOptionsPlugin.apply (C:\Users\userName\Documents\Git\bft3\node_modules\@angular-devkit\build-angular\node_modules\webpack\lib\SourceMapDevToolModuleOptionsPlugin.js:50:27)
    at C:\Users\userName\Documents\Git\bft3\node_modules\@angular-devkit\build-angular\node_modules\webpack\lib\SourceMapDevToolPlugin.js:163:53
    at Hook.eval [as call] (eval at create (C:\Users\userName\Documents\Git\bft3\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:374:1)
    at Hook.CALL_DELEGATE [as _call] (C:\Users\userName\Documents\Git\bft3\node_modules\webpack\node_modules\tapable\lib\Hook.js:14:14)
    at Compiler.newCompilation (C:\Users\userName\Documents\Git\bft3\node_modules\webpack\lib\Compiler.js:1122:26)
    at C:\Users\userName\Documents\Git\bft3\node_modules\webpack\lib\Compiler.js:1166:29
    at _next0 (eval at create (C:\Users\userName\Documents\Git\bft3\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:41:1)
    at eval (eval at create (C:\Users\userName\Documents\Git\bft3\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:55:1)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

By reading other, similar posts i think it could be because of multiple versions of webpack.

Here are the related packages/deps: yarn list --pattern "webpack"

├─ @angular-devkit/[email protected]
│  └─ [email protected]
├─ @angular-devkit/[email protected]
├─ @cypress/[email protected]
├─ @ngtools/[email protected]
├─ @nrwl/[email protected]
│  └─ [email protected]
├─ @nrwl/[email protected]
│  └─ [email protected]
├─ @nrwl/[email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  └─ [email protected]
├─ @storybook/[email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  └─ [email protected]
│     └─ [email protected]
├─ @storybook/[email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  └─ [email protected]
├─ @storybook/[email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  └─ [email protected]
├─ @storybook/[email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  └─ [email protected]
├─ @storybook/[email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  └─ [email protected]
│     └─ [email protected]
├─ @storybook/[email protected]
│  ├─ [email protected]
│  └─ [email protected]
├─ @types/[email protected]
├─ @types/[email protected]
├─ @types/[email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
└─ [email protected]

I'm not quite experienced enough to debug this completely, so do you see an issue here with webpack or have any other idea what might be causing this?

Thanks in advance for any help!

CodePudding user response：

Try to fix the webpack version to v5.74.0 in package.json file. It worked for me!

...
"webpack": "5.74.0"

Then run yarn to force install the selected version.

CodePudding user response：

using webpack version 5.64 fixed this issue for me!