npm ERESOLVE could not resolve #angular/elements#11.2.14 after trying to update to angular 12 - node.js

I have a angular 11 application and i wanted to update it to the latest 14, based on the officiel website i had to go update one by one so 11 to 12, 12 to 13 and 13 to 14.
So i created a new branch on git and started [here][1] with ng update #angular/core#12 #angular/cli#12, i had a bunch of dependencies issues after so i rolled back on the master branch, but i still have problems with npm dependencies, everytime i do a npm install i have something like this that i don't understand at all :
npm i
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: #angular/elements#11.2.14
npm ERR! Found: #angular/core#11.0.9
npm ERR! node_modules/#angular/core
npm ERR! #angular/core#"~11.0.9" from the root project
npm ERR! peer #angular/core#"11.0.9" from #angular/animations#11.0.9
npm ERR! node_modules/#angular/animations
npm ERR! #angular/animations#"~11.0.9" from the root project
npm ERR! peer #angular/animations#"^11.0.0 || ^12.0.0-0" from #angular/material#11.0.3
npm ERR! node_modules/#angular/material
npm ERR! #angular/material#"^11.0.3" from the root project
npm ERR! 1 more (#angular/platform-browser)
npm ERR! 13 more (#angular/cdk, #angular/common, #angular/fire, ...)
I tried to do npm install --force and npm install --legacy-peer-deps, but still i can't just do npm install as i'm used to, is there something that breaks angular when doing the ng update.
for the versions that i use i have :
Angular CLI: 11.0.7
Node: 16.15.1
OS: win32 x64
Angular: 11.0.9
npm: 8.11.0
Do you think i need to reinstall angular? I don't get how the project can be broken when i rolled back to the branch before any modification on the project. I feel like the easiest way to update is to create a new project on the version you want and add everything back in it little by little.
if you have any idea on this i'll take it.
Thanks in advance !
[1]: https://update.angular.io/?l=3&v=11.0-12.0

Related

npm ERR! ERESOLVE unable to resolve dependency tree when installing #nest/microservices

I'm trying to install new dependency to my service,
#nest/microservices: ^7.0.3 and got this error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: vb-service-ads#0.0.1
npm ERR! Found: #nestjs/common#8.4.7
npm ERR! node_modules/#nestjs/common
npm ERR! #nestjs/common#"^8.4.7" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer #nestjs/common#"^7.0.0" from #nestjs/microservices#7.6.18
npm ERR! node_modules/#nestjs/microservices
npm ERR! #nestjs/microservices#"^7.0.3" from the root project
npm ERR!
so versions of packages with problem are:
"#nestjs/common": "^8.4.7",
"#nestjs/core": "^7.6.15"
I tried to upgrade versions of core and microservices dependencies to ^8.0.0, and got more dependencies broken and also tried to downgrade common to ^7.6.15 and got same effect.
Tried to use yarn instead of npm, it resolved my problem, but i need all packages to be installed by npm
So, I resolved this problem, with deleting node_modules, package-lock.json and removing dependencies and devDependencies in package.json
After i've installed all dependencies manually one by one
you can see the solution here, or at least this is what worked for me here. https://www.angularjswiki.com/angular/unable-to-resolve-dependency-tree-error-in-angular-while-installing-npm-packages/
I leave you the part where it worked for me
To fix Unable to resolve dependency tree error in Angular while
installing npm packages follow the below steps.
Run npm install --save --legacy-peer-deps instead of npm install command. Another way is delete the node_modules folder and
package_lock.json file and then
Run npm cache clean --force after npm i --force command.

How do you read npm audit ERESOLVE error?

I often receive error ERESOLVE similar to below. How do you read it?
>npm audit fix
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: myapp#0.0.0
npm ERR! Found: #angular/compiler#12.1.0
npm ERR! node_modules/#angular/compiler
npm ERR! #angular/compiler#"12.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer #angular/compiler#"12.1.1" from #angular/compiler-cli#12.1.1
npm ERR! node_modules/#angular/compiler-cli
npm ERR! dev #angular/compiler-cli#"^12.1.0" from the root project
npm ERR! peer #angular/compiler-cli#"^12.0.0 || ^12.1.0-next" from #angular-devkit/build-angular#12.1.0
npm ERR! node_modules/#angular-devkit/build-angular
npm ERR! dev #angular-devkit/build-angular#"12.1.0" from the root project
And how do you read it - Which package depends on which? Which end of the tree I have control of? Top or bottom?
Did I add #angular-devkit/build-angular into my app and it needs but cant find angular/compiler ? or is it the other way around?
I can be wrong but this is what I read:
Which package depends on which?
Your app directly depends on:
#angular/compiler#"12.1.0"
#angular/compiler-cli#"^12.1.0"
#angular-devkit/build-angular#"12.1.0"
Your app transitively depends on:
#angular/compiler#"12.1.1" from #angular/compiler-cli#12.1.1 <- which is the actual #angular/compiler-cli version installed in your node_modules.
#angular/compiler-cli#"^12.0.0 || ^12.1.0-next" from #angular-devkit/build-angular#12.1.0 <- which is the actual #angular-devkit/build-angular version installed in your node_modules.
So what I read is that there is a conflict because your app directly depends on #angular/compiler#"12.1.0" and transitively on #angular/compiler#"12.1.1" (from #angular/compiler-cli#12.1.1)
You can probably fix this by adding what it looks like a missing caret, ie #angular/compiler#"^12.1.0".
Unrelated ^, I had a similar problem but all versions where compatible. I deleted package-lock.json and node_modules and installed them again and it worked fine.
I've fixed it with following commands:
rm package-lock.json
rm -rf node_modules
yarn install
npm i

Issue when I try to execute npm install

when I run the command npm install, it displays this error:
[log#server:www]$ npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined#undefined
npm ERR! Found: vue#2.6.14
npm ERR! node_modules/vue
npm ERR! dev vue#"^2.5.17" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue#"^3.0.0" from vee-validate#4.4.4
npm ERR! node_modules/vee-validate
npm ERR! vee-validate#"^4.2.3" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /root/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2021-06-09T01_39_40_386Z-debug.log
I wonder, how can I fix it? What does it mean?
Thanks
It looks like you're trying to install vee-validate version 4.0 in a Vue 2.x application. You can see the compatible version in the vee-validate repo.
How to fix:
Option 1:
Install an older version of Vee-validate (v2 or v3).
First, you'll need to uninstall the version you currently have installed (I'm assuming you installed vee-validate#next since that's the doc recommendation)
npm uninstall vee-validate#next
You can then find the list of versions available with
npm info vee-validate versions
Finally, install an older version with
npm install vee-validate#3.4.9
Replace the 3.4.9 with whatever version you would like to install - as of the time of writing, 3.4.9 is the latest stable tag
Option 2:
Upgrade from Vue 2 to Vue 3 following the upgrade guide.
Note that this is still a work in progress and may have some stability issues and depending on the state of the project I would consider using the above option for the time being.
Step:-1 Make sure node.js is installed on your system. You can check with the command npm --version or node --version
Step:-2 Clear npm cache. run this command npm cache clear -f
Step:-3 Then try to run npm install

I have just installed npm and ionic following the instructions on ionic framework website and as soon as i start a new project i get these errors

I'm new to Ionic Framework. I have just installed npm and ionic following the instructions on ionic framework website and as soon as i start a new project i get these errors.
Ionic Info
Ionic:
Ionic CLI : 6.12.4
Utility:
cordova-res : not installed
native-run : not installed
System:
NodeJS : v15.7.0
npm : 7.4.3
OS : macOS Big Sur
% ionic start
? Framework: Angular
? Project name: app
? Starter template: blank
✔ Preparing directory ./aps in 887.30μp
✔ Downloading and extracting blank starter in 143.10ms
? Integrate your new app with Capacitor to target native iOS and Android? No
Installing dependencies may take several minutes.
──────────────────────────────────────────────────────────────
Ionic Appflow, the mobile DevOps solution by Ionic
Continuously build, deploy, and ship apps 🚀
Focus on building apps while we automate the rest 🎁
👉 https://ion.link/appflow 👈
──────────────────────────────────────────────────────────────
> npm i
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: aps#0.0.1
npm ERR! Found: typescript#4.1.3
npm ERR! node_modules/typescript
npm ERR! peer typescript#">=4.0 <4.2" from #angular/compiler-cli#11.1.2
npm ERR! node_modules/#angular/compiler-cli
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!
npm ERR! Could not resolve dependency:
npm ERR! peer typescript#"~4.0.0" from #angular-devkit/build-angular#0.1100.7
npm ERR! node_modules/#angular-devkit/build-angular
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/<username>/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/<username>/.npm/_logs/2021-02-04T03_19_54_834Z-debug.log
[ERROR] An error occurred while running subprocess npm.
npm i exited with exit code 1.
Re-running this command with the --verbose flag may provide more
information.
I ran into the same issue. After running ionic start I was able to run npm install --force from within the project folder and get #angular-devkit/build-angular#0.1100.7 to install. I believe this is a compatibility issue on angular's side. I did confirm I was able to serve the project locally. However, I would not consider this a permanent solution due to the possibility of conflicts with #angular-devkit/build-angular#0.1100.7 and the version of typescript you are currently running.

NPM fails to install types

I have a problem with npm install, in that it won't install #types.
This works fine
npm install --save lodash
However asking for types does not
npm install --save #types/lodash
PS C:\Development\Temp> npm install --save #types/lodash
npm WARN `git config --get remote.origin.url` returned wrong result (git://github.com/types/lodash)
npm WARN `git config --get remote.origin.url` returned wrong result (git#github.com:types/lodash)
npm ERR! git clone git#github.com:types/lodash Cloning into bare repository 'C:\Users\myuser\AppData\Roaming\npm-cache\_git-remotes\git-github-com-types-lodash-9eb5372a'...
npm ERR! git clone git#github.com:types/lodash Host key verification failed.
npm ERR! git clone git#github.com:types/lodash fatal: Could not read from remote repository.
npm ERR! git clone git#github.com:types/lodash
npm ERR! git clone git#github.com:types/lodash Please make sure you have the correct access rights
npm ERR! git clone git#github.com:types/lodash and the repository exists.
npm ERR! addLocal Could not install types/lodash
npm ERR! Error: ENOENT: no such file or directory, stat 'C:\Development\Temp\types\lodash'
npm ERR! If you need help, you may report this *entire* log,
npm ERR! including the npm and node versions, at:
npm ERR! <http://github.com/npm/npm/issues>
npm ERR! System Windows_NT 10.0.15063
npm ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\ProgramData\\chocolatey\\lib\\npm\\tools\\node_modules\\npm\\bin\\npm-cli.js" "install" "--save" "#types/lodash"
npm ERR! cwd C:\Development\Temp
npm ERR! node -v v8.6.0
npm ERR! npm -v 1.4.9
npm ERR! path C:\Development\Temp\types\lodash
npm ERR! syscall stat
npm ERR! code ENOENT
npm ERR! errno -4058
npm ERR!
npm ERR! Additional logging details can be found in:
npm ERR! C:\Development\Temp\npm-debug.log
npm ERR! not ok code 0
PS C:\Development\Temp>
This has got me scratching my head. I've updated Chocolatey, NodeJS, NPM to make sure their own the latest versions. Tried the commands on empty folders or an existing TypeScript project - thinking it might be getting confused being ran within a Git repository (error: remote.origin.url). Looking at the GitHub URL it makes no sense git://github.com/types/lodash
I took these examples from MSDN Blog - The Future of Declaration Files
Update: I've uninstalled Node.js and tried reinstalling v6.11.3 LTS or v8.6.0. However the #types command still fails.
Update 2: I've realised Chocolately was masking the npm version. I removed the Chocolately folder, and upgraded npm as per #Louis answer.
Upgrade your npm version to version 4 or 5. I'm mentioning 4 because I ran into problems with 5, and using 4 is still viable. I don't know of any good reason to run an older version.
You are using npm version 1.4.9, as shown in this line of the log:
npm ERR! npm -v 1.4.9
The problem is that npm versions prior to version 2 do not support scoped packages. Packages that begin with an # are scoped packages, so #types/lodash is a scoped package. You need npm version 2 or greater to install it. If you were to use the latest npm in the 1.x series (1.4.29), you'd get a better error message:
npm ERR! Error: This version of npm doesn't support scoped packages (caused by reference to #types/lodash). Update to npm#2+.
Version 1.4.9 did not even know that scoped packages were a thing, so it cannot give a nice error message. It looks like it took the # symbol as signifying that the package name is an address and filled in the missing information with Github as the default host.
The upgrade command I typically use to upgrade npm is:
npm install -g npm
You can specify a specific version by replacing the npm argument with one that gives specific version number. npm#4, for instance, would install the latest npm in the 4.x series. If you don't specify a version number, you get the latest released version.

Resources