Node module's dependencies will not update after update or install? - node.js

Question

I want to use react-highcharts in my application. I used npm install react-highcharts, which succeeded with the warning:
found 1 high severity vulnerability, run `npm audit fix` to fix them, or `npm audit` for details.
npm audit fix did nothing; it said I had to manually fix the issue. I ran npm audit to see what was going on, and got
=== npm audit security report ===
┌──────────────────────────────────────────────────────────────────────────────┐
│ Manual Review │
│ Some vulnerabilities require your attention to resolve │
│ │
│ Visit https://go.npm.me/audit-guide for additional guidance │
└──────────────────────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High │ Cross-Site Scripting │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package │ highcharts │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in │ >=7.2.2 <8.0.0 || >=8.1.1 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ react-highcharts │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path │ react-highcharts > highcharts │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info │ https://npmjs.com/advisories/1227 │
└───────────────┴──────────────────────────────────────────────────────────────┘
found 1 high severity vulnerability in 994 scanned packages
1 vulnerability requires manual review. See the full report for details.
The "More info" link and the "Patched in" row reveal that this was fixed in highcharts >=8.1.1. The most recent version is highcharts#9.0.0, so I decided to update it:
❯ npm update highcharts -dd
npm info it worked if it ends with ok
npm verb cli [
npm verb cli '/usr/local/bin/node',
npm verb cli '/usr/local/bin/npm',
npm verb cli 'update',
npm verb cli 'highcharts',
npm verb cli '-dd'
npm verb cli ]
npm info using npm#6.14.10
npm info using node#v14.15.4
npm verb npm-session 0b92b8dc64938cea
npm verb update computing outdated modules to update
npm verb exit [ 0, true ]
npm timing npm Completed in 1507ms
npm info ok
"It worked if it ends in ok," but look:
❯ npm list highcharts
myproj#1.0.0 /Users/actinidia/myproj
└─┬ react-highcharts#16.1.0
└── highcharts#6.2.0
I still have highcharts#6.2.0! And running npm install highcharts just leads to a second copy of highcharts, though the new version is indeed version 9.0.0:
├── highcharts#9.0.0
└─┬ react-highcharts#16.1.0
└── highcharts#6.2.0
How do I update the dependency that react-highcharts will use?

Answer 1

You should uninstall highcharts first and install again.
npm uninstall react-highcharts
npm install react-highcharts

Answer 2

I followed ppotaczek's advice and installed the officialy supported wrapper for Highcharts. It was as easy as
❯ npm install highcharts-react-official
npm WARN highcharts-react-official#3.0.0 requires a peer of highcharts#>=6.0.0
but none is installed. You must install peer dependencies yourself.
+ highcharts-react-official#3.0.0
added 1 package and audited 992 packages in 4.48s
❯ npm install highcharts
+ highcharts#9.0.0
added 1 package from 1 contributor and audited 993 packages in 4.978s

Answer 3

Remove installed: node_modules and package-lock.json
Modify the package.json format as follows
npm audit fix --force
npm install