Table of Contents
Consider React version 16.8.3. Have you ever wondered what are these numbers? Are they some random numbers or do they have any meaning?
NPM uses semantic versioning to version the packages. Here's what the three numbers (from left to right) indicate:
- Major version: The first number indicates a major release, which potentially can include breaking changes.
- Minor version: The second number indicates a minor release, which contains enhancements and does not contain any breaking changes.
- Patch version: The last number indicates a patch release, which is mainly done for fixing bugs.
So if we are migrating to a newer major version, then it can be called as an upgrade and if it involves only a minor or a patch version, we can call it an update.
Have you seen packages named as
package.json? and wanted to know what the symbols ~ and ^ indicate.
- ~ represents that while updating the package, the latest patch version can be safely installed.
That is, for
axios@~0.27.2, we can safely install
^ represents that while updating the package, the latest minor version can be safely installed, That is, for
react@^16.8.3, we can safely install
There are 2 scenarios:
- When the
package-lock.jsonexists: It will install the exact same version mentioned in
- When the
package-lock.jsondoesn't exist: It will install the latest safe version of the respective package.
To know which all packages are outdated and need to be updated, you can run the following command in your project:
In the output, Wanted indicates the version to which we can safely update. The latest shows the latest version available in the registry.
If you need to update the packages that can be safely updated, then you can run the following command to update them.
If you want to update individual packages then specify their name next to the command:
1npm update react react-dom
To update to the latest version, you can run:
1npm i <package>@latest
npm i react@latest
If you want to update all the packages to their latest available version in one go, then you can use the package npm-check-updates as follows:
1npx npm-check-updates -u
The above command will update the
package.json with the latest versions of the packages.
npm install will update the packages to the latest version
It is always recommended not to upgrade the packages in one go since most probably you might end up breaking the application and will spend a lot of time fixing it. So, always upgrade one package, test the app, then upgrade the next.
If you have liked article, stay in touch with me by following me on twitter.