76

I am trying to get my app to deploy on Heroku. I was getting the "sh: 1: ng: not found" error but based on responses on here, I moved my @angular/cli, @angular-devkit/build-angular, @angular/compiler-cli, and typescript. Now I am getting a "Could not resolve dependency: npm ERR! peer @angular/compiler@"11.2.8"" error. I think it is having a versioning issue? I'm not sure what is going on.

I've tried running 'npm update' and tried manually inserting the '@angular/compiler@"11.2.8"' to dependencies and then running 'npm i' but both give me this same error.

Here is my error:

npm ERR! Found: @angular/compiler@11.0.9
npm ERR! node_modules/@angular/compiler
npm ERR!   @angular/compiler@"~11.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/compiler@"11.2.8" from @angular/compiler-cli@11.2.8
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   dev @angular/compiler-cli@"^11.0.9" from the root project
npm ERR!   peer @angular/compiler-cli@"^11.0.0" from @angular-devkit/build-angular@0.1100.7
npm ERR!   node_modules/@angular-devkit/build-angular
npm ERR!     @angular-devkit/build-angular@"~0.1100.2" from the root project

Package.json:

"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "postinstall": "ngcc"
  },
  "private": true,
  "dependencies": {
    "@angular-devkit/build-angular": "~0.1100.2",
    "@angular/animations": "~11.0.1",
    "@angular/cdk": "^11.2.6",
    "@angular/cli": "~11.0.2",
    "@angular/common": "~11.0.1",
    "@angular/compiler": "~11.0.1",
    "@angular/core": "~11.0.1",
    "@angular/flex-layout": "^11.0.0-beta.33",
    "@angular/forms": "~11.0.1",
    "@angular/material": "^11.2.6",
    "@angular/platform-browser": "~11.0.1",
    "@angular/platform-browser-dynamic": "~11.0.1",
    "@angular/router": "~11.0.1",
    "angular-in-memory-web-api": "^0.11.0",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "typescript": "~4.0.2",
    "uuid": "^3.4.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1100.2",
    "@angular/cli": "~11.0.2",
    "@angular/compiler-cli": "^11.0.9",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.1.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2"
  }

How does one resolve this error?

ΩmegaMan
  • 29,542
  • 12
  • 100
  • 122
AylaWinters
  • 1,121
  • 2
  • 7
  • 24

8 Answers8

177

In addition to using the npm install --save --legacy-peer-deps command line option, this can also be set more permanently as a config option: npm config set legacy-peer-deps true.

If above approach does not work try removing the node_modules folder and package-lock.json file and run command npm install.

Salahuddin Ahmed
  • 4,854
  • 4
  • 14
  • 35
  • the npm install --save --legacy-peer-deps command gave me an "Error: Error on worker #1: TypeError: compiler_1.devOnlyGuardedExpression is not a function" do you know what that means? – AylaWinters Apr 07 '21 at 16:42
  • 2
    I tried the second command and then deleting the node_modules/package-lock.json and I think the compiler versioning issue is fixed! Thank you!! Unfortunately now the ng not found issue is back... I'll do more research on that – AylaWinters Apr 07 '21 at 17:04
  • 2
    I had a quite similar problem and the 2nd method did the trick for me. – danielcaballero88 Jun 22 '21 at 11:14
  • 3
    @Salahuddin Ahmad , Thank you the first solution worked with me! – Khalid Aug 19 '22 at 23:09
  • Delete node_modules and package-lock.json then run command npm install will work :) – dineshsivalingam May 11 '23 at 18:45
  • needed to run ```npx npm-check-updates -u``` before ```npm i``` personally. Hope that helps anyone floundering like I was XD. – Micah Aug 22 '23 at 16:51
32

Sound like a problem with Peer Dependencies try with npm install --legacy-peer-deps.

Beller
  • 828
  • 1
  • 6
  • 19
  • 2
    That gave me a "Error: Error on worker #1: TypeError: compiler_1.devOnlyGuardedExpression is not a function" error – AylaWinters Apr 07 '21 at 15:55
12

Per the npm CLI config docs:

Use of legacy-peer-deps is not recommended, as it will not enforce the peerDependencies contract that meta-dependencies may rely on.

In an attempt to try to follow npm's recommendations, instead of setting --legacy-peer-deps I checked the package-lock.json and noticed that the devDependencies (for Angular-related packages) were still referencing the older version (in my case 13.0.1, upgrading to 13.2.0).

I simply deleted the package-lock.json and ran npm install and it installed the updates that ng update @angular/cli @angular/core had made (to package.json).

Deleting node_modules was also not necessary.

James Skemp
  • 8,018
  • 9
  • 64
  • 107
6

You may be using a newer version of node. I got this using node 17. I rolled node back to 14 (the version used in the project originally) and npm installed fine.

I recommend using NVM in the future. You can add a .nvm file to you project so you can lock in the node version to use.

Ian
  • 2,898
  • 1
  • 27
  • 29
1

None of the above solutions worked for me. Here's a my workaround.

  1. Take a copy of src folder.
  2. Delete the angular project and create a new one.
  3. Replace the old src with the new one.
  4. Install the dependencies.

It's kind of a fresh install but with the version you desire.

Reza Taba
  • 1,151
  • 11
  • 15
1

Use this command with your desired plugin intsall.

In my case it was ngx-scrollbar plugin. So, finally command will be:

npm install ngx-scrollbar --save --legacy-peer-deps
LearningIsNever EndingProcess
  • 181
  • 1
  • 5
1

Tried all solutions mentioned above but nothing worked for me. Uninstalled and installed node again -> npm install. guess what? it worked. :)

Abhi
  • 614
  • 2
  • 12
  • 26
1

For people facing issues with more recent @angular upgrades, this was a helpful process:

  1. Run one of these: (option 1):npm install --save --legacy-peer-deps (option 2) - permanent config option: npm config set legacy-peer-deps true
  2. Remove node_modules folder and package-lock.json file
  3. Run: npx npm-check-updates -u
  4. Run: npm install

The one extra step that helps in this process is step 3: npx npm-check-updates -u. This helps update your package.json to add all the latest versions so you're up to date and your npm i runs without issues.

Micah
  • 479
  • 1
  • 7
  • 17