Сборник рассказов не запускается: TypeError: аргумент «компиляция» должен быть экземпляром компиляции.

Пытаюсь запустить Storybook в монорепозитории NX, но получаю эту ошибку при попытке выполнить следующие команды:

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)

Читая другие похожие сообщения, я думаю, что это может быть из-за нескольких версий webpack.

Вот связанные пакеты/депозиты: yarn list --pattern "webpack"

├─ @angular-devkit/build-angular@14.2.9
│  └─ webpack@5.74.0
├─ @angular-devkit/build-webpack@0.1402.9
├─ @cypress/webpack-preprocessor@5.15.5
├─ @ngtools/webpack@14.2.9
├─ @nrwl/angular@15.0.13
│  └─ webpack-merge@5.7.3
├─ @nrwl/cypress@15.0.13
│  └─ fork-ts-checker-webpack-plugin@7.2.13
├─ @nrwl/webpack@15.0.13
│  ├─ copy-webpack-plugin@10.2.4
│  ├─ fork-ts-checker-webpack-plugin@7.2.13
│  └─ webpack-dev-server@4.11.1
├─ @storybook/builder-webpack4@6.5.13
│  ├─ terser-webpack-plugin@4.2.3
│  ├─ webpack-dev-middleware@3.7.3
│  ├─ webpack-sources@1.4.3
│  ├─ webpack-virtual-modules@0.2.2
│  └─ webpack@4.46.0
│     └─ terser-webpack-plugin@1.4.5
├─ @storybook/builder-webpack5@6.5.13
│  ├─ fork-ts-checker-webpack-plugin@6.5.2
│  ├─ html-webpack-plugin@5.5.0
│  └─ webpack-dev-middleware@4.3.0
├─ @storybook/core-common@6.5.13
│  ├─ fork-ts-checker-webpack-plugin@6.5.2
│  ├─ terser-webpack-plugin@1.4.5
│  ├─ webpack-sources@1.4.3
│  └─ webpack@4.46.0
├─ @storybook/core-server@6.5.13
│  ├─ terser-webpack-plugin@1.4.5
│  ├─ webpack-sources@1.4.3
│  └─ webpack@4.46.0
├─ @storybook/manager-webpack4@6.5.13
│  ├─ terser-webpack-plugin@4.2.3
│  ├─ webpack-dev-middleware@3.7.3
│  ├─ webpack-sources@1.4.3
│  ├─ webpack-virtual-modules@0.2.2
│  └─ webpack@4.46.0
│     └─ terser-webpack-plugin@1.4.5
├─ @storybook/manager-webpack5@6.5.13
│  ├─ html-webpack-plugin@5.5.0
│  └─ webpack-dev-middleware@4.3.0
├─ @types/webpack-env@1.18.0
├─ @types/webpack-sources@3.2.0
├─ @types/webpack@4.41.33
├─ case-sensitive-paths-webpack-plugin@2.4.0
├─ copy-webpack-plugin@11.0.0
├─ css-minimizer-webpack-plugin@3.4.1
├─ fork-ts-checker-webpack-plugin@4.1.6
├─ html-webpack-plugin@4.5.2
├─ license-webpack-plugin@4.0.2
├─ pnp-webpack-plugin@1.6.4
├─ terser-webpack-plugin@5.3.6
├─ tsconfig-paths-webpack-plugin@3.5.2
├─ webpack-bundle-analyzer@4.7.0
├─ webpack-dev-middleware@5.3.3
├─ webpack-dev-server@4.11.0
├─ webpack-filter-warnings-plugin@1.2.1
├─ webpack-hot-middleware@2.25.3
├─ webpack-log@2.0.0
├─ webpack-merge@5.8.0
├─ webpack-node-externals@3.0.0
├─ webpack-sources@3.2.3
├─ webpack-subresource-integrity@5.1.0
├─ webpack-virtual-modules@0.4.6
└─ webpack@5.75.0

У меня недостаточно опыта, чтобы полностью отладить это, так что вы видите здесь проблему с веб-пакетом или у вас есть какие-либо другие идеи, что может быть причиной этого?

Заранее благодарю за любую помощь!

Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare.
Для развертывания Сайтов с использованием Blazor, Angular и React с репозиторием на GitHub на Cloudflare.
Как развернуть сайты с помощью Blazor, Angular и React с репозиторием на GitHub на Cloudflare.
Шаблоны Angular PrimeNg
Шаблоны Angular PrimeNg
Как привнести проверку типов в наши шаблоны Angular, использующие компоненты библиотеки PrimeNg, и настроить их отображение с помощью встроенной...
Promise и Observables в Angular
Promise и Observables в Angular
Здесь мы рассмотрим основные различия между обещаниями и наблюдаемыми таблицами на примере.
Как использовать d3.js для рисования 2D SVG-элементов в приложении Angular?
Как использовать d3.js для рисования 2D SVG-элементов в приложении Angular?
D3.js - это обширная библиотека, используемая для привязки произвольных данных к объектной модели документа (DOM). Мы разберем основные варианты...
Разработка Drupal и AngularJS: Идеальное сочетание для вашей веб-стратегии
Разработка Drupal и AngularJS: Идеальное сочетание для вашей веб-стратегии
Один опытный веб-разработчик назвал комбинацию Drupal и AngularJS "сочетанием, созданным на небесах". Почему так? Потому что вместе они могут создать...
Создание многостраничной формы заявления о приеме на работу с помощью Angular
Создание многостраничной формы заявления о приеме на работу с помощью Angular
Наличие на корпоративном сайте форм заявлений о приеме на работу, или "трудовых анкет", экономит время и деньги как для соискателей, так и для...
1
0
411
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Попробуйте исправить версию webpack на v5.74.0 в файле package.json. Это сработало для меня!

...
"webpack": "5.74.0"

Затем запустите yarn, чтобы принудительно установить выбранную версию.

Спасибо за ваш вклад, в этой версии была та же ошибка.

Bambi 28.11.2022 19:43
Ответ принят как подходящий

Использование веб-пакета версии 5.64 устранило эту проблему для меня!

Другие вопросы по теме