Ionic / React : impossible to run npm install / dependencies problem

Hello,

I'm trying to use Ionic with React, so I went to Ionic website to generate a new app.

I have followed the documentation on the Ionic website.

npm install -g @ionic/cli cordova-res
git clone https://gitlab.com/vincent15000/shoppingmiam.git shoppingmiam
cd shoppingmiam && npm install && ionic serve

When I ran npm install, I got 72 vulnerabilities.

I have searched on the web and I have found the npm-check-updates package, so I ran ncu -u to update all packages in the JSON file.

Now when I run npm install, I get this error message.

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react-router
npm ERR!   react-router@"^6.4.3" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react-router@"^5.0.1" from @ionic/[email protected]
npm ERR! node_modules/@ionic/react-router
npm ERR!   @ionic/react-router@"^6.3.4" 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 /home/vincent/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/vincent/.npm/_logs/2022-11-08T19_44_59_093Z-debug-0.log

I get exactly the same problem if I install ionic in command line.

How can I solve this problem ?

Thanks for your help.

Vincent

Sinnbeck

3 years ago

Level 102

Get it working first and then look lnto the vulnerabilities. So start over and ignore it when it says it found them

1 like

vincent15000

3 years ago

Level 63

@Sinnbeck Ok thank you ... but how is it possible to solve the vulnerabilities once it works ?

Here is the npm audit report.

# npm audit report

nth-check  <2.0.1
Severity: high
Inefficient Regular Expression Complexity in nth-check - https://github.com/advisories/GHSA-rp65-9cf3-cjxr
fix available via `npm audit fix --force`
Will install [email protected], which is a breaking change
node_modules/svgo/node_modules/nth-check
  css-select  <=3.1.0
  Depends on vulnerable versions of nth-check
  node_modules/svgo/node_modules/css-select
    svgo  1.0.0 - 1.3.2
    Depends on vulnerable versions of css-select
    node_modules/svgo
      @svgr/plugin-svgo  <=5.5.0
      Depends on vulnerable versions of svgo
      node_modules/@svgr/plugin-svgo
        @svgr/webpack  4.0.0 - 5.5.0
        Depends on vulnerable versions of @svgr/plugin-svgo
        node_modules/@svgr/webpack
          react-scripts  >=2.1.4
          Depends on vulnerable versions of @svgr/webpack
          node_modules/react-scripts

6 high severity vulnerabilities

To address all issues (including breaking changes), run:
  npm audit fix --force

I already tried npm audit fix --force, that's what gave me 72 vulnerabilities.

Sinnbeck

3 years ago

Best Answer

Level 102

@vincent15000 if npm audit fix cannot fix it, you need to go over them one by one and research how to fix that specific vuln

1 like

vincent15000

3 years ago

Level 63

@Sinnbeck Ok thank you.

Please or to participate in this conversation.