How To Update A Particular Npm Package?

Accept you e'er tried to update a npm packet and and then realized that it breaks all other packages in your Javascript project?

This is a mutual trouble for web developers, luckily in that location are some easy steps to take earlier updating a module.

In this blog post, I will show yous how to update npm packages without breaking your project by post-obit four simple steps:

Understand npm parcel versioning
Audit installed npm packages
Update only i npm package at time
Test your lawmaking afterwards updating npm packages

Cheat Sheet: 6 must-know commands to update npm packages

Pace 1: Understand npm package versioning

Versioning is an important part of npm and how to use updates safely when developing web applications.

Most npm packages follow semantic versioning guidelines.

Semantic versioning ways that developers should compose a bundle version of three numbers separated by periods (e.g., "0.12.31").

MAJOR.Small.PATCH versioning format

The first number, called the major version, indicates how meaning a release this is in relation to other releases with the same small and patch levels. Major version number indicates incompatible API changes.

The second number, called the minor version, indicates how much new functionality has been introduced since the last significant release; for example, if this change was just small fixes or enhancements to existing features and no behavior changes were made then information technology would result in a higher value. Minor releases are non as risky every bit major version because they typically introduce new features, but they are not as risky equally major updates because no API changes were made.

The tertiary number is called the patch version and information technology indicates how much bug fixes or enhancements take been introduced since the last minor release; for instance, if this change was only modest fixes or enhancements to existing features and no behavior changes were added.

What do the caret (^) and tilde (~) hateful?

In package.json, a version tin can have a ^ in forepart (east.g. ^0.12.31), meaning the latest minor release may be safely installed.

Tilde (~) in front (e.g., ~0.12.31) means the latest patch release is safe to install.

Npm package dependencies listed in package.json file. — An example of npm packages that are listed equally dependencies in the package.json file. All dependencies have a caret (^) in front, showing that it is safe to install the latest minor versions.

package.json
package.json is a file that keeps track of all the packages your app needs to run properly, likewise as settings for how it should behave when running on different platforms and environments.

Step 2: Audit installed npm packages

Before you update npm packages, figure out if yous have a expert reason to.

It is ameliorate to stick with the bundle version that works. That way you volition non accept a risk of something breaking.

Chief reasons for upgrading npm packages are:

Recent version of the bundle having a feature that we want
Fixed bugs in the latest version of an npm package
Updated dependencies for another package that y'all are using
A security vulnerability in the npm packet
Upgrade of the environment where the project is running is not compatible with the the current version of the npm package

Couple of npm commands that will help you audit your packages before upgrading:

npm list --depth 0 lists all packages at the pinnacle level
npm inspect checks for security vulnerabilities or out-of-date versions
npm outdated lists written report of package versions compared to versions specified in package.json file

npm list --depth 0

npm listing --depth 0 lists all installed npm packages, simply just at the top level.

Listing packages at the peak level is enough near of the fourth dimension. Elevation-level dependencies unremarkably take care of their inner dependencies.

npm audit

npm inspect will run a security vulnerability cheque against your project and report whatever found issues. It is not perfect, just it helps to find potential problems if you are using npm packages that have security vulnerabilities. It'southward non perfect because not all vulnerabilities are reported to npm.

npm outdated

npm outdated will study whatever out-of-date packages in your projection.

It shows electric current, wanted and latest versions compared to versions specified in package.json file.

Current: is the currently installed version.
Wanted: The maximum version of the packet that is immune by the version range in bundle.json.
Latest: version of the package is the i that is tagged every bit "latest" in the npm registry.

Note: npm outdated command but shows the direct dependencies of the root project. Only if you want to meet other dependencies also, then use "--all."

Check for breaking changes before you update

Some npm packages will innovate breaking changes, which may crusade errors when using the module.

Earlier making a breaking change, parcel developers often add "Breaking Changes" messages to the console output. It ways that the module volition modify in future versions and developers need to keep an eye out for it.

To see if in that location are any breaking changes, you can besides await at the "Breaking Changes" department of the package'southward readme file.

You tin unremarkably discover bundle's readme file in:

npm packet'south page on the npm registry
within of a module directory, check node_modules folder inside of your project
projection's website (or GitHub)

Step three: Update only one package at time

When updating, we need to be careful to only update packages we want. In that location is no demand to update all of your modules at the same time.

Start past making updates in small batches and test each batch for any issues that might arise. This will allow y'all to find out how it'south affecting your project, and it will allow you isolate any errors.

npm update

Changing the package version in package.json file and running npm install will near probable non do anything because already installed package version satisfies the versioning in the package.json file.

Rather than using npm install, you tin can use the npm update control to upgrade already installed packages. When you lot run a npm update, npm checks if there are newer versions out in that location that satisfy specified semantic versioning ranges that you specified in packet.json and installs them.

To update a specific npm package, run the post-obit in console:

How to revert npm package updates?

If there are any bugs, you can easily undo the changes with these ii commands:

The @version should be the same version that you had installed previously.

Step iv: Test your code subsequently installing new packages

In order to brand certain your code however works later updating npm packages, it's important that you test the functionality before deploying. This is considering a package update may cause errors in your awarding if you are not careful. To avoid these issues, I recommend running all tests on server and client side besides as manually checking for any JavaScript error letters throughout the site.

Steps:

Run all unit and integration tests from both serverside and clientside by running npm test or equivalent command for your project.
Review package logs for clues about what caused an issue or where things went wrong during installation

These 3 simple steps can aid yous avert breaking your projection by carefully installing new npm packages.

What are some of the other ways that people accept cleaved their projects? Permit the states know in the comments below, and we'll write a weblog mail on them!

Bonus Tip: Articulate npm enshroud

Every bit of npm@5, the npm cache self-heals from abuse issues and data extracted from the cache is guaranteed to be valid. If you lot want to make sure everything is consistent, utilize 'npm cache verify' instead. On the other hand, if you're debugging an issue with the installer, you can use npm install --enshroud /tmp/empty-cache to utilise a temporary cache instead of nuking the bodily one.

Sometimes npm doesn't pull the latest version of the packet because it has an older version stored in cache. Equally of npm@five, cache problems should not be happening. Merely they still do sometimes.

To articulate npm cache, run npm cache make clean --force. This control clears npm's cache of all the packages that your projection has installed with npm install or npm update.

It does not remove any dependencies from package.json, simply it may help resolve a dependency issue if there is an outdated version in the cache and yous tin can't find which i it is by looking through the packages list.

Cheat Sheet: half dozen Commands To Aid You Update npm Packages

This cheat sheet will make it like shooting fish in a barrel to safely update npm packages in your node application. It includes a list of commands that volition help you proceed up with the latest updates and avert breaking changes.

Use npm list --depth 0 to listing all the packages in your package directory
Use npm audit to find out which of your npm dependencies are vulnerable.
Use npm outdated to listing the packages that are out of engagement with respect to what is installed in package.json
Use npm update package_name to update an individual parcel that has already been installed.
Use npm uninstall package_name and npm install package_name@version to revert to a specific version.
Use npm cache clean --force to clear npm's cache of all the packages that take been installed.

Source: https://josipmisko.com/posts/how-to-update-npm-packages-in-4-easy-steps

Posted by: anayafromescon.blogspot.com