Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: The 'compilation' argument must be an instance of Compilation #20773

Closed
Tallyb opened this issue May 13, 2021 · 21 comments
Closed

TypeError: The 'compilation' argument must be an instance of Compilation #20773

Tallyb opened this issue May 13, 2021 · 21 comments
Labels
needs: more info Reporter must clarify the issue

Comments

@Tallyb
Copy link

Tallyb commented May 13, 2021

Upgrading from angular 11.2 to angular 12 and trying ng build / ng serve causes this error.

Is this a regression?

yes. Used to build in previous version.

Description

A clear and concise description of the problem...

Minimal Reproduction

https://stackblitz.com/...

Exception or Error


TypeError: The 'compilation' argument must be an instance of Compilation
    at Function.getCompilationHooks (/Users/me/my-proj/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js:125:10)
    at /Users/me/my-proj/node_modules/terser-webpack-plugin/dist/index.js:566:67
    at _next43 (eval at create (/Users/me/my-proj/node_modules/tapable/lib/HookCodeFactory.js:19:10), :77:1)
    at _next21 (eval at create (/Users/me/my-proj/node_modules/tapable/lib/HookCodeFactory.js:19:10), :189:1)
    at Hook.eval [as call] (eval at create (/Users/me/my-proj/node_modules/tapable/lib/HookCodeFactory.js:19:10), :279:1)
    at Hook.CALL_DELEGATE [as _call] (/Users/me/my-proj/node_modules/tapable/lib/Hook.js:14:14)
    at Compiler.newCompilation (/Users/me/my-proj/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1031:26)
    at /Users/me/my-proj/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1073:29
    at Hook.eval [as callAsync] (eval at create (/Users/me/my-proj/node_modules/tapable/lib/HookCodeFactory.js:33:10), :22:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/Users/me/my-proj/node_modules/tapable/lib/Hook.js:18:14)
    at Compiler.compile (/Users/me/my-proj/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:1068:28)
    at /Users/me/my-proj/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:496:12
    at Compiler.readRecords (/Users/me/my-proj/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:908:11)
    at /Users/me/my-proj/node_modules/@angular-devkit/build-angular/node_modules/webpack/lib/Compiler.js:493:11
    at Hook.eval [as callAsync] (eval at create (/Users/me/my-proj/node_modules/tapable/lib/HookCodeFactory.js:33:10), :10:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/Users/me/my-proj/node_modules/tapable/lib/Hook.js:18:14)
An unhandled exception occurred: The 'compilation' argument must be an instance of Compilation
See "/private/var/folders/99/y2bb165n66q99tqwsv7bpt600000gn/T/ng-GPq9IO/angular-errors.log" for further details.

Your Environment

Angular Version:


@angular-devkit/architect       0.1200.0
@angular-devkit/build-angular   12.0.0
@angular-devkit/core            12.0.0
@angular-devkit/schematics      12.0.0
@nguniversal/builders           12.0.0
@nguniversal/express-engine     12.0.0
@schematics/angular             12.0.0
rxjs                            7.0.0
typescript                      4.2.4

Anything else relevant?

@JoostK JoostK transferred this issue from angular/angular May 13, 2021
@alan-agius4
Copy link
Collaborator

@richie50,

Can you please provide the output of ng v and npm ls webpack?

Thanks.

@alan-agius4 alan-agius4 added the needs: more info Reporter must clarify the issue label May 13, 2021
@Tallyb
Copy link
Author

Tallyb commented May 14, 2021

│ ├─┬ @angular-devkit/build-optimizer@0.1200.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ @angular-devkit/build-webpack@0.1200.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ @ngtools/webpack@12.0.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ circular-dependency-plugin@5.2.2
│ │ └── webpack@5.37.0 deduped
│ ├─┬ copy-webpack-plugin@8.1.1
│ │ └── webpack@5.37.0 deduped
│ ├─┬ css-loader@5.2.4
│ │ └── webpack@5.37.0 deduped
│ ├─┬ less-loader@8.1.1
│ │ └── webpack@5.37.0 deduped
│ ├─┬ mini-css-extract-plugin@1.5.1
│ │ └── webpack@5.37.0 deduped
│ ├─┬ postcss-loader@5.2.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ raw-loader@4.0.2
│ │ └── webpack@5.37.0 deduped
│ ├─┬ sass-loader@11.0.1
│ │ └── webpack@5.36.2 deduped
│ ├─┬ source-map-loader@2.0.1
│ │ └── webpack@5.37.0 deduped
│ ├─┬ style-loader@2.0.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ stylus-loader@5.0.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ terser-webpack-plugin@4.2.3
│ │ └── webpack@5.37.0 deduped
│ ├─┬ webpack-dev-middleware@4.1.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ webpack-dev-server@3.11.2
│ │ ├─┬ webpack-dev-middleware@3.7.3
│ │ │ └── webpack@5.37.0 deduped
│ │ └── webpack@5.37.0 deduped
│ ├─┬ webpack-subresource-integrity@1.5.2
│ │ ├─┬ html-webpack-plugin@4.5.2
│ │ │ └── webpack@5.37.0 deduped
│ │ └── webpack@5.37.0 deduped
│ └─┬ webpack@5.36.2
│   └─┬ terser-webpack-plugin@5.1.2
│     └── webpack@5.36.2 deduped
├─┬ @storybook/addon-docs@6.2.9
│ ├─┬ @storybook/builder-webpack4@6.2.9
│ │ ├─┬ css-loader@3.6.0
│ │ │ └── webpack@4.46.0 deduped
│ │ ├─┬ dotenv-webpack@1.8.0
│ │ │ └── webpack@4.46.0 deduped
│ │ ├─┬ postcss-loader@4.2.0
│ │ │ └── webpack@4.46.0 deduped
│ │ ├─┬ style-loader@1.3.0
│ │ │ └── webpack@4.46.0 deduped
│ │ ├─┬ terser-webpack-plugin@3.1.0
│ │ │ └── webpack@4.46.0 deduped
│ │ ├─┬ webpack-dev-middleware@3.7.3
│ │ │ └── webpack@4.46.0 deduped
│ │ ├─┬ webpack-filter-warnings-plugin@1.2.1
│ │ │ └── webpack@4.46.0 deduped
│ │ └─┬ webpack@4.46.0
│ │   └─┬ terser-webpack-plugin@1.4.5
│ │     └── webpack@4.46.0 deduped
│ └─┬ webpack@5.37.0
│   └─┬ terser-webpack-plugin@5.1.2
│     └── webpack@5.37.0 deduped
├─┬ @storybook/addon-essentials@6.2.9
│ └── webpack@5.37.0 deduped
├─┬ @storybook/angular@6.2.9
│ ├─┬ @storybook/core-common@6.2.9
│ │ └─┬ webpack@4.46.0
│ │   └─┬ terser-webpack-plugin@1.4.5
│ │     └── webpack@4.46.0 deduped
│ ├─┬ postcss-loader@4.2.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ sass-loader@10.2.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ ts-loader@8.2.0
│ │ └── webpack@4.46.0 deduped
│ └─┬ webpack@4.46.0
│   └─┬ terser-webpack-plugin@1.4.5
│     └── webpack@4.46.0 deduped
├─┬ @storybook/builder-webpack5@6.2.9
│ ├─┬ dotenv-webpack@6.0.4
│ │ └── webpack@5.37.0 deduped
│ ├─┬ file-loader@6.2.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ html-webpack-plugin@5.3.1
│ │ └── webpack@5.37.0 deduped
│ ├─┬ terser-webpack-plugin@5.1.2
│ │ └── webpack@5.37.0 deduped
│ ├─┬ url-loader@4.1.1
│ │ └── webpack@5.37.0 deduped
│ └── webpack@5.37.0 deduped
├─┬ @storybook/core@6.2.9
│ ├─┬ @storybook/core-client@6.2.9
│ │ └── webpack@5.37.0 deduped
│ └─┬ @storybook/core-server@6.2.9
│   ├─┬ css-loader@3.6.0
│   │ └── webpack@4.46.0 deduped
│   ├─┬ dotenv-webpack@1.8.0
│   │ └── webpack@4.46.0 deduped
│   ├─┬ style-loader@1.3.0
│   │ └── webpack@4.46.0 deduped
│   ├─┬ terser-webpack-plugin@3.1.0
│   │ └── webpack@4.46.0 deduped
│   ├─┬ webpack-dev-middleware@3.7.3
│   │ └── webpack@4.46.0 deduped
│   └─┬ webpack@4.46.0
│     └─┬ terser-webpack-plugin@1.4.5
│       └── webpack@4.46.0 deduped
├─┬ @storybook/html@6.2.9
│ └─┬ html-loader@1.3.2
│   └── webpack@5.37.0 deduped
├─┬ @storybook/preset-scss@1.0.3
│ └─┬ sass-loader@11.1.0
│   └── webpack@5.37.0 deduped
├─┬ babel-loader@8.2.2
│ └── webpack@5.37.0 deduped
└─┬ pdfjs-dist@2.8.335
  └─┬ worker-loader@3.0.8
    └── webpack@5.37.0 deduped

@Tallyb
Copy link
Author

Tallyb commented May 14, 2021

You have webpack installed more than once.

npm i --save-dev webpack@5.36

with terser being a dep of webpack AND having webpack as a dependency, I do not think it can be avoided.

@zehavibarak
Copy link

zehavibarak commented May 14, 2021 via email

@Tallyb
Copy link
Author

Tallyb commented May 14, 2021

@zehavibarak thank you for your attempt to help. can you explain a bit what do you think the issue is and how this will solve it?

@zehavibarak
Copy link

zehavibarak commented May 14, 2021 via email

@zehavibarak
Copy link

bash

npm i --save-dev sass-loader terser-webpack-plugin css-loader webpack-dev-middleware style-loader dotenv-webpack ts-loader sass-loader

and verify webpack is of 5.37

@alan-agius4
Copy link
Collaborator

alan-agius4 commented May 14, 2021

Webpack is a direct dependency of @angular-devkit/build-angular and it should not be added as a direct dependency in your project unless you use Webpack directly.

Probably, something went wrong during module hoisting, can you please try the below;

rm -rf node_modules package-lock.json
npm i 

NB: please revert any changes suggested above by @zehavibarak. This will most certainly cause your project to be in a broken state.

@zehavibarak
Copy link

zehavibarak commented May 14, 2021 via email

@careywalker
Copy link

I am having this issue as well. The webpack version alignment didn't work. I'll try the below to see if that helps:

rm -rf node_modules package-lock.json
npm i

@zehavibarak
Copy link

@careywalker share your npm ls webpack

@careywalker
Copy link

This isn't an issue for me anymore.

What I did:

  1. Deleted the specific reference I had to webpack from package.json (I had this there because I was using webpack 5 with Angular 11 so I could start using module-federation. I'm converting an existing application to use a micro-front end architecture)
  2. Deleted package-lock.json
  3. Ran npm install
  4. Ran ng update @angular/core@12 @angular/cli@12

Once I did the above, I no longer get the error on ng build.

@mshima
Copy link

mshima commented May 15, 2021

The error happens when there are 2 versions of webpack in the dependency tree. eg webpack@5.37.0 and webpack@5.36.2.
@angular-devkit/build-angular@12.0.0 has a transient dependency on webpack@5.36.2 and will fail when webpack@!=5.36.2 is in @angular-devkit/build-webpack tree.

There are no safeguards for this problem.
IMO:

  • @angular-devkit/build-angular should add a peer dependency on webpack@5.36.2.
  • @angular/angular-cli should add a peer dependency on @angular-devkit/build-angular.

This will force webpack@5.36.2 to be deduped at the root of the project.

To workaround the problem:

  • Add dependency on webpack@5.36.2 or remove webpack from dependency and recreate node_modules/package-lock
  • Don't use npm install --force (not deduping right), use npm install --legacy-peer-deps instead.

@clydin
Copy link
Member

clydin commented May 15, 2021

If npm install --legacy-peer-deps resolves the problem, then the issue's root cause could likely be a defect in npm 7. From the npm ls output above, there is a valid version of Webpack (5.36.2) available that could be used to satisfy the sibling peer dependencies. However, npm 7 appears to be choosing to ignore that already installed instance and use a different version (5.37.0) to satisfy those peer dependencies. There have been several critical peer dependency versioning defects corrected in recent versions of npm 7. If not on the latest version of npm 7 (currently: 7.13.0), please try upgrading. If this issue is occurring with the latest version of npm 7, that would be useful information as well.

@mshima
Copy link

mshima commented May 15, 2021

Using npm 7.13.0.
npm install -f bug reproducible by:
npm install -f @ng-bootstrap/ng-bootstrap @angular-devkit/build-angular browser-sync-webpack-plugin

Additional peer dependencies would prevent a broken tree:

npm install webpack@5.37.0 @angular-devkit/build-angular
npm uninstall webpack
npm ls webpack
├─┬ @angular-devkit/build-angular@12.0.0
│ ├─┬ @angular-devkit/build-optimizer@0.1200.0
│ │ └── webpack@5.37.0 deduped
│ ├─┬ @angular-devkit/build-webpack@0.1200.0
│ │ └── webpack@5.37.0 deduped

@rp3e11
Copy link

rp3e11 commented May 16, 2021

I had a fairly similar issue, though I think not exactly the same. It is probably closer to #20786 which is marked a duplicate of this issue, so I still posted here. In contrast to this issue I use npm 6.14.3.

I use an nx workspace with angular, nestjs and storybook. When upgrading angular the app did not serve anymore throwing the following error

Error: webpack_1.util.cleverMerge is not a function
Error: webpack_1.util.cleverMerge is not a function
Error: webpack_1.util.cleverMerge is not a function

npm ls webpack resulted in

├─┬ @angular-devkit/build-angular@12.0.0
│ └── UNMET PEER DEPENDENCY webpack@5.36.2 
├─┬ @nrwl/nest@12.3.3
│ └─┬ @nrwl/node@12.3.3
│   └── webpack@4.42.0 
├─┬ @storybook/angular@6.2.9
│ ├─┬ @storybook/core@6.2.9
│ │ └─┬ @storybook/core-server@6.2.9
│ │   ├─┬ @storybook/builder-webpack4@6.2.9
│ │   │ └── webpack@4.46.0  deduped
│ │   └── webpack@4.46.0  deduped
│ ├─┬ @storybook/core-common@6.2.9
│ │ └── webpack@4.46.0  deduped
│ └── webpack@4.46.0 
├─┬ @storybook/builder-webpack5@6.2.9
│ └── webpack@5.37.0 
└─┬ @types/webpack@5.28.0
  └── webpack@5.37.0 

The upgarde left webpack at version 4 in the node_modules folder. I deleted the node_modules folder and package-lock.json and made a fresh npm install and it worked again. npm ls webpack now reports

├─┬ @angular-devkit/build-angular@12.0.0
│ └── webpack@5.36.2 
├─┬ @nrwl/nest@12.3.3
│ └─┬ @nrwl/node@12.3.3
│   └── webpack@4.42.0 
├─┬ @storybook/angular@6.2.9
│ ├─┬ @storybook/core@6.2.9
│ │ └─┬ @storybook/core-server@6.2.9
│ │   ├─┬ @storybook/builder-webpack4@6.2.9
│ │   │ └── UNMET PEER DEPENDENCY webpack@4.46.0 
│ │   └── UNMET PEER DEPENDENCY webpack@4.46.0 
│ ├─┬ @storybook/core-common@6.2.9
│ │ └── webpack@4.46.0 
│ └── webpack@4.46.0 
├─┬ @storybook/builder-webpack5@6.2.9
│ └── webpack@5.36.2  deduped
└─┬ @types/webpack@5.28.0
  └── webpack@5.36.2  deduped

It seems as if the dependencies of webpack for angular and @nrwl/node are met, while the storybook dependency is not met.
Could it be that the angular update does not update webpack in case another package relies on an older version of webpack?

@danielritter
Copy link

danielritter commented May 17, 2021

I have the same issue, when I use npm i -f:

+-- @angular-devkit/build-angular@12.0.0
| +-- @angular-devkit/build-optimizer@0.1200.0
| | `-- webpack@5.37.0 deduped
| +-- @angular-devkit/build-webpack@0.1200.0
| | `-- webpack@5.37.0 deduped
| +-- @ngtools/webpack@12.0.0
| | `-- webpack@5.37.0 deduped
| +-- circular-dependency-plugin@5.2.2
| | `-- webpack@5.37.0 deduped
| +-- copy-webpack-plugin@8.1.1
| | `-- webpack@5.37.0 deduped
| +-- css-loader@5.2.4
| | `-- webpack@5.37.0 deduped
| +-- less-loader@8.1.1
| | `-- webpack@5.37.0 deduped
| +-- mini-css-extract-plugin@1.5.1
| | `-- webpack@5.37.0 deduped
| +-- postcss-loader@5.2.0
| | `-- webpack@5.37.0 deduped
| +-- raw-loader@4.0.2
| | `-- webpack@5.37.0 deduped
| +-- sass-loader@11.0.1
| | `-- webpack@5.37.0 deduped
| +-- source-map-loader@2.0.1
| | `-- webpack@5.37.0 deduped
| +-- style-loader@2.0.0
| | `-- webpack@5.37.0 deduped
| +-- stylus-loader@5.0.0
| | `-- webpack@5.37.0 deduped
| +-- terser-webpack-plugin@4.2.3
| | `-- webpack@5.37.0 deduped
| +-- webpack-dev-middleware@4.1.0
| | `-- webpack@5.37.0 deduped
| +-- webpack-dev-server@3.11.2
| | +-- webpack-dev-middleware@3.7.3
| | | `-- webpack@5.37.0 deduped
| | `-- webpack@5.37.0 deduped
| +-- webpack-subresource-integrity@1.5.2
| | +-- html-webpack-plugin@4.5.2
| | | `-- webpack@5.37.0 deduped
| | `-- webpack@5.37.0 deduped
| `-- webpack@5.36.2
|   `-- terser-webpack-plugin@5.1.2
|     `-- webpack@5.36.2 deduped
+-- @nrwl/cypress@12.3.3
| `-- @cypress/webpack-preprocessor@4.1.5
|   `-- webpack@4.46.0
|     `-- terser-webpack-plugin@1.4.5
|       `-- webpack@4.46.0 deduped
+-- @nrwl/node@12.3.3
| +-- circular-dependency-plugin@5.2.0
| | `-- webpack@4.42.0 deduped
| +-- copy-webpack-plugin@6.0.3
| | `-- webpack@4.42.0 deduped
| `-- webpack@4.42.0
|   `-- terser-webpack-plugin@1.4.5
|     `-- webpack@4.42.0 deduped
+-- @nrwl/schematics@8.12.11
| `-- @nrwl/angular@8.12.11
|   `-- @nrwl/cypress@8.12.11
|     `-- @cypress/webpack-preprocessor@4.1.5
|       `-- webpack@4.46.0
|         `-- terser-webpack-plugin@1.4.5
|           `-- webpack@4.46.0 deduped
+-- @storybook/addon-docs@6.2.9
| +-- @storybook/builder-webpack4@6.2.9
| | +-- css-loader@3.6.0
| | | `-- webpack@4.46.0 deduped
| | +-- dotenv-webpack@1.8.0
| | | `-- webpack@4.46.0 deduped
| | +-- file-loader@6.2.0
| | | `-- webpack@5.37.0 deduped
| | +-- postcss-loader@4.3.0
| | | `-- webpack@4.46.0 deduped
| | +-- style-loader@1.3.0
| | | `-- webpack@4.46.0 deduped
| | +-- terser-webpack-plugin@3.1.0
| | | `-- webpack@4.46.0 deduped
| | +-- url-loader@4.1.1
| | | `-- webpack@5.37.0 deduped
| | +-- webpack-dev-middleware@3.7.3
| | | `-- webpack@4.46.0 deduped
| | +-- webpack-filter-warnings-plugin@1.2.1
| | | `-- webpack@4.46.0 deduped
| | `-- webpack@4.46.0
| |   `-- terser-webpack-plugin@1.4.5
| |     `-- webpack@4.46.0 deduped
| +-- @storybook/core@6.2.9
| | +-- @storybook/core-client@6.2.9
| | | `-- webpack@5.37.0 deduped
| | `-- @storybook/core-server@6.2.9
| |   +-- css-loader@3.6.0
| |   | `-- webpack@4.46.0 deduped
| |   +-- dotenv-webpack@1.8.0
| |   | `-- webpack@4.46.0 deduped
| |   +-- style-loader@1.3.0
| |   | `-- webpack@4.46.0 deduped
| |   +-- terser-webpack-plugin@3.1.0
| |   | `-- webpack@4.46.0 deduped
| |   +-- webpack-dev-middleware@3.7.3
| |   | `-- webpack@4.46.0 deduped
| |   `-- webpack@4.46.0
| |     `-- terser-webpack-plugin@1.4.5
| |       `-- webpack@4.46.0 deduped
| `-- webpack@5.37.0
|   `-- terser-webpack-plugin@5.1.2
|     `-- webpack@5.37.0 deduped
+-- @storybook/addon-essentials@6.2.9
| `-- webpack@5.37.0 deduped
+-- @storybook/addon-postcss@2.0.0
| +-- css-loader@3.6.0
| | `-- webpack@5.37.0 deduped
| +-- postcss-loader@4.3.0
| | `-- webpack@5.37.0 deduped
| `-- style-loader@1.3.0
|   `-- webpack@5.37.0 deduped
+-- @storybook/angular@6.2.9
| +-- @storybook/core-common@6.2.9
| | `-- webpack@4.46.0
| |   `-- terser-webpack-plugin@1.4.5
| |     `-- webpack@4.46.0 deduped
| +-- postcss-loader@4.3.0
| | `-- webpack@4.46.0 deduped
| +-- sass-loader@10.2.0
| | `-- webpack@4.46.0 deduped
| +-- ts-loader@8.2.0
| | `-- webpack@4.46.0 deduped
| `-- webpack@4.46.0
|   `-- terser-webpack-plugin@1.4.5
|     `-- webpack@4.46.0 deduped
+-- babel-loader@8.2.2
| `-- webpack@5.37.0 deduped
`-- storybook-addon-designs@5.4.5
  `-- react-pdf@4.2.0
    `-- pdfjs-dist@2.1.266
      +-- webpack@4.46.0
      | `-- terser-webpack-plugin@1.4.5
      |   `-- webpack@4.46.0 deduped
      `-- worker-loader@2.0.0
        `-- webpack@4.46.0 deduped

When I use npm install --legacy-peer-deps it compiles but at the end I get an Undefined: missing '{' error and the application cannot be opened and in my root application I have a This syntax requires an imported helper but module 'tslib' cannot be found error.

@BrandonClapp
Copy link

I was having this same issue in my nx workspace and finally figured it out.

I was hoping that nx would handle upgrading/removing the webpack dependencies, but it did not. Coming from previous version of angular, we've had webpack as a direct dev dependency inside of our package.json.

npm ls webpack was giving me unmet peer dependencies on @angular-devkit/build-angular@12.0.1.

I read in another issue (#20786 (comment)) that webpack doesn't need to be installed directly, because it's a dependency of the @angular-devkit/build-angular

Steps that fixed it for me:

  • Remove webpack as a direct devDependency in package.json (not needed anymore)
  • Deleted node_modules & package.lock.json
  • npm install

@alan-agius4
Copy link
Collaborator

Closing as this doesn't appear to be caused by the Angular CLI.

@johncrim
Copy link

johncrim commented Jun 7, 2021

I was experiencing the same error. While we use webpack directly for some projects in our monorepo (so can't/shouldn't remove the explicit webpack dependency), we had a resolutions block in our package.json which was originally put there to use webpack 5 with Angular 11:

  "resolutions": {
    "webpack": "^5.0.0"
  },

Thanks to the pointers from @alan-agius4 and others, I found that removing this block, and deleting yarn.lock and node_modules then running yarn fixes the problem.

PiDelport added a commit to ntls-io/nautilus-wallet that referenced this issue Jul 1, 2021
…12.0.4+

@angular-devkit/build-angular 12.0.4+ makes build-storybook hang.

Constraining it to 12.0.3 avoids the hang.

Upstream issue, and workaround:

storybookjs/storybook#15227 (comment)

Also jump through some hoops to downgrade webpack from 5.39.1 to 5.38.1,
to match the exact dependency expected by @angular-devkit/build-angular,
and avoid this problem:

angular/angular-cli#20773
PiDelport added a commit to ntls-io/nautilus-wallet that referenced this issue Jul 6, 2021
…12.0.4+

@angular-devkit/build-angular 12.0.4+ makes build-storybook hang.

Constraining it to 12.0.3 avoids the hang.

Upstream issue, and workaround:

storybookjs/storybook#15227 (comment)

Also jump through some hoops to downgrade webpack from 5.39.1 to 5.38.1,
to match the exact dependency expected by @angular-devkit/build-angular,
and avoid this problem:

angular/angular-cli#20773
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Jul 8, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
needs: more info Reporter must clarify the issue
Projects
None yet
Development

No branches or pull requests

10 participants