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
 
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
 
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
 
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
 
varshithvhegde profile image
Varshith V Hegde

impressive things

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
 
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!