DEV Community

Cover image for How to update a few years old outdated project in Node and React?

How to update a few years old outdated project in Node and React?

Meat Boy on August 24, 2023

Navigating old Node.js dependencies can be confusing. In this article, I'll share how I decoded this challenge in a few-year-old repository using a...
Collapse
 
ideahub_charlie profile image
Charlie from IdeaHub •

I love it when things are named well: 'dependancy-time-machine' is perfect!

Collapse
 
raffizulvian profile image
Raffi Zulvian Muzhaffar •

Impressive work! This will help incrementally update old dependencies that are years behind more easily.

Collapse
 
meatboy profile image
Meat Boy •

Thanks. That was the goal. I found many times in articles online to suggest blindly updating all at once to the latest patch/minor/major version and #yolo. Then people were surprised they got a bunch of issues at once in the face.

Collapse
 
defested profile image
Jake Kast • • Edited

When I attempt to run it with the install flag, it fails saying that the list of packages is not being passed into yarn.
I would expect the yarn add to need to be "yarn add [package name]", but it is only running yarn add without the package.

`PM> npx dependency-time-machine --update --install-script "yarn add" --install
New version found: async@0.9.0 (2014-05-16T10:20:22.247Z)
Updating async@0.9.0 in [PROJECT PATH]\package.json...
Installing new version...
npx : error Missing list of packages to add to your project.
At line:1 char:1

  • npx dependency-time-machine --update --install-script "yarn add" --in ...
  • ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    • CategoryInfo : NotSpecified: (error Missing l...o your project.:String) [], RemoteException
    • FullyQualifiedErrorId : NativeCommandError

node:internal/errors:857
const err = new Error(message);
^

Error: Command failed: cd [PROJECT PATH] && yarn add && cd -
error Missing list of packages to add to your project.`

Collapse
 
varshithvhegde profile image
Varshith V Hegde •

impressive things

Collapse
 
randreu28 profile image
Rubén Chiquin •

If you're using yarn, you can do yarn --upgrade-intreractive and you'll be able to choose which package to update and if you want a minor,medium or major update for each package. It's a really good native way of solving the update of old dependencies. That's the only reason I prefer yarn over npm!

Collapse
 
meatboy profile image
Meat Boy •

I agree, yarn --upgrade-interactive is a great way to update deps. However, this must be done regularly or in a fairly small repository to quickly catch and fix issues.

When a project is huge and outdated by a few years, it makes this really difficult to spot which libs are compatible with which others and some e.g. babel, babel loaders, core-js, webpack, jest plugins and others are making this process even more complicated as they are often base for other dependencies, some left a long time ago.

The tiny tool I wrote about is to fill the missing gap in the dev ecosystem with a huge, highly outdated project as mentioned.

Collapse
 
kwakyebrilliant profile image
a_moah__ •

Great work

Collapse
 
moraym profile image
Moray Macdonald •

Very impressive! I wish I had this a few months ago upgrading from 12 to 16. Now I have to manually update our ORM before I can use this to go from 16 to 20...

Collapse
 
efpage profile image
Eckehard •

Wait a year, and you do the same work again. Is'nt this frustrating? Any hint to ease this pain for the future?

Collapse
 
ricardogesteves profile image
Ricardo Esteves •

Awesome articles! I'm having a similar situation so this help me quite a bit.
Will definitely try it.

Collapse
 
mehmehmehlol profile image
Megan Lo • • Edited

Found this article because I needed to update my React website, which I built a few years ago lol. Shout out to the library you wrote - it's gonna help a lot of people!

Collapse
 
aleksey_lukyanov_dev profile image
Aleksey Lukyanov •

It's sounds great!