How to Safely Update NPM Packages
ฝัง
- เผยแพร่เมื่อ 23 ส.ค. 2024
- NPM Check Updates helps you incrementally and safely upgrade your package.json dependencies to the latest versions. In this video, I walk you through my workflow for using ncu.
🔗 Key Links 🔗
- Blog article: chrispenningto...
- NPM-Check-Updates: www.npmjs.com/...
---------------------------------------
🌐 Connect With Me 🌐
- Website: www.codinginpu...
- Blog: www.chrispenni...
- Twitter: / cpenned
I didn't expect to update my packages this way and easy. Thank you very much!
You are welcome!
This gives me a more structured approach to dealing with package upgrades. Makes me more calm about the approach except maybe with the major updates, but confidence will come with time :)
Glad it was a help!
bro you saved me from depression , hahah. I had been stuck for a week with my project throwing all kinds of errors "for no reason", since i hadn't done anything to break my code. I had no idea that npm packages would outdated and throw all these errors. thank you.
So glad it was a help! Thanks for saying something!
I have been waiting for this video all along! Cleared all my doubts!
🙌🏼 glad to hear!
Is it weird to say I love you? This was awesome! Thanks for the info!
That escalated quickly! Ha! You're welcome
Thank you so much, I was exactly looking for this. Please keep it up
Glad it was a help!
Coming from Shaun channel, leaving a sub :) Great content :)
Thanks for the kind words. Hope you keep enjoying the content!
great video, this is the easiest way to fix package.json dependencies! We literally spent a whole day fixing 108 dependencies, dependabot auto update is the other way but this is surely the best way to fix dependencies! Thanks again!
You’re welcome! Glad it was a help!
Very helpful video and explained in easy way
Glad you enjoyed it! Thanks for saying something!
Very helpful! Thank you for sharing! Great channel! Incredible content
You’re welcome! Glad you’re enjoying the channel!
Bro you just make my project work! Thank you
Awesome! Thanks for letting me know. Made my day
From react 16.5 to 18 it was my major jump
Wow!
One thing to be mindful of are peer dependency requirements if you have some framework that relies on you to install stuff it needs (instead of the package itself installing a dependency directly). There can be issues arising from conflicts of poorly-authored peer requirements. An example is in NestJS, where say, you're on version 9, but a third-party package offering a NestJS plugin for some SaaS or whatever requires NestJS versions 7 to 9. This is fine until you upgrade Nest to 10, then the peer dependencies won't resolve because your version is too new, even though in a vast majority of cases it will work just fine. I had this issue with a RabbitMQ NestJS binding that didn't account for the new version, and I could not upgrade the rest to v10 because of that one package until the author updated it. NPM unresolved dependencies are a nightmare to deal with.
Great point!
bro, you fucking saving my lifeeee! frfr 😭😭😭
Here for you!
this is an amazing way man! love the way you teaching! well, I learned how to get the deal done! amazing. and what about the Vulnerabilities ! are they important? cuz I did audit fix and --force but didn't effected!
They can be important, but it’s nothing you can really fix. It’s up to the packages. So it’s mostly fine to ignore them. Obviously you’re responsible to check out the error if you’re concerned. But that’s most what I do :)
@@CodinginPublic really thanks! I was concerned for two days how to fix them! And now I got it. Thanks man! Best of luck, peace ✌️
Shawn said subscribe, so here I am 😊
lol I listen to everything he says, too! 🙌 hope to make it worth your while here :)
After updating npm dependencies my websites hero section is no more responsive (tailwind css used) dont know what to do it broke my website.
Thank you! 👏❤
You’re welcome! I didn't know this at the time, but in more recent versions of NPM there’s actually an update command built in. It’s just `npm update` you can also add the --dry-run tag to see what it WOULD have done. May be more to it than that, but I've since moved over to using PNPM, so I haven't looked carefully :)
Coulnd't figure out how to install npu?? Safe to download this? What is it? Honestly just want to learn how to update ONE SINGLE dependency in list of package.json dependencies. That shouldn't be hard, but is.
Is running ‘npm outdated’ comparable to ‘npx ncu’? It would negate the need to install a redundant package.
I think it’s mostly preference. NPX would bypass that install though, so feel free to stick with that.
How is it different form runing npm outdated and then npm update or npm install specyfic version?
I do believe npm has added some update functionality, but since I'm mostly using PNPM these days, I haven't looked into it. It's very possible that ncu is no longer needed.
Shawn send me here, you have awesome content!
🙏🏼 thanks so much!
hey, what platform do you use for posting blogs? is it custom build? if it is then please share the tech stack you used...
I've mostly used Hugo for static site blogs, but I'm planning on moving over to Astro to be able to incorporate some React components when needed. Mostly published to Netlify or Vercel.
I need to update some of packages from version 8.x.x to 15 !!! and even patch update brakes some dependencies
woww! :)
IMPORTANT: npm-check-updates requires "node": ">=14.14"
Good to know! Thanks!
literarly nothing works . keep having error with every commands that you type in . either I don't have permissions or the package has been depricated or the program is outdated!!!!!!
Hmm…it's still working for me. Feel free to pass along the errors your getting and I'm happy to help if I can.
What theme you use for zsh
agnoster, I think. github.com/agnoster/agnoster-zsh-theme
Could you please share your terminal's theme? :)
Sure, so I'm using zsh with the Agnoster theme and then Monokai pro for VSCode with the Octagon theme variant. Hope that helps!
@@CodinginPublic For sure! Thank you ^_^
i am gett all these errors
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: google-maps-react@2.0.6
npm ERR! Found: react@17.0.2
npm ERR! node_modules/react
npm ERR! react@"^17.0.2" from the root project
npm ERR! peer react@">=16.0.0" from @ant-design/icons@4.8.0
npm ERR! node_modules/@ant-design/icons
npm ERR! @ant-design/icons@"^4.8.0" from the root project
npm ERR! @ant-design/icons@"^4.7.0" from antd@4.24.10
npm ERR! node_modules/antd
npm ERR! antd@"4.24.10" from the root project
npm ERR! 60 more (@chatscope/chat-ui-kit-react, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"~0.14.8 || ^15.0.0 || ^16.0.0" from google-maps-react@2.0.6
npm ERR! node_modules/google-maps-react
npm ERR! google-maps-react@"^2.0.6" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react@16.14.0
npm ERR! node_modules/react
npm ERR! peer react@"~0.14.8 || ^15.0.0 || ^16.0.0" from google-maps-react@2.0.6
npm ERR! node_modules/google-maps-react
npm ERR! google-maps-react@"^2.0.6" 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!
Hmm. What if you delete your package.json and node_modules, and then run the commands?