{

npm-check-updates update packages in package.json and bower.json | ncu command in nodejs


npm-check-updates update packages in package.json and bower.json

In this blog post, We are going to learn the npm-check-updates npm package to update dependencies in package.json and bower.json.

npm package update

npm, check updates package is used to check all dependencies in package.json of a node js project and update dependencies to the latest versions. This package works by updating the following configuration files

  • package.json
  • bower.json

This library solves all the below problems of a NodeJS application

  • How to update all dependencies in package.json to the latest versions?
  • How to update devDependencies in package.json to the latest versions
  • Update dependencies in bower.json to the latest version
  • npm check and update package if needed

Setup npm-check-updates or ncu package globally

node and npm commands should work before installing npm-check-updates`. Find the installed node and npm version to check installed or not

B:\cloudhadoop>node --version
v14.17.0

B:\cloudhadoop>npm --version
7.11.1

Please install npm-check-updates globally using npm install command.

npm i -g npm-check-updates  

Once installed, the ncu command is available.

B:\cloudhadoop>ncu --version  
2.14.1  

How to check outdated dependency in package.json

To update any packages to the latest versions, First, you need to check outdated the old version. Please issue the npm outdated command.

The below example checks outdated dependencies in angular package.json

B:\Workspace\blog\angularapp>npm outdated  
Package                        Current  Wanted   Latest  Location  
@angular-devkit/build-angular    0.7.5   0.7.5    0.8.5  angularapp  
@angular/cli                     6.1.5   6.1.5    6.2.5  angularapp  
@types/node                      8.9.5   8.9.5  10.12.0  angularapp  
codelyzer                        4.2.1   4.2.1    4.5.0  angularapp  
jasmine-core                    2.99.1  2.99.1    3.2.1  angularapp  
karma                            1.7.1   1.7.1    3.0.0  angularapp  
karma-jasmine-html-reporter      0.2.2   0.2.2    1.3.1  angularapp  
protractor                       5.3.2   5.3.2    5.4.1  angularapp  
ts-node                          5.0.1   5.0.1    7.0.1  angularapp  
tslint                           5.9.1   5.9.1   5.11.0  angularapp  
typescript                       2.7.2   2.7.2    3.1.3  angularapp  

The same can be achieved with the npm command

npm list dependencyname

This lists and current version and direct dependency versions

B:\myblogs\cloudhadoop>npm list webpack
cloudhadoop@1.0.0 B:\myblogs\cloudhadoop
+-- babel-loader@8.1.0
| `-- webpack@4.42.1 deduped
+-- compression-webpack-plugin@3.1.0
| `-- webpack@4.42.1 deduped
+-- webpack@4.42.1
| `-- terser-webpack-plugin@1.4.5
|   `-- webpack@4.42.1 deduped
`-- workbox-webpack-plugin@5.1.2
  `-- webpack@4.42.1 deduped

How to check dependencies and update to the latest versions?

with the ncu command, You can list out all the packages with current versions and the latest versions of package.json.

B:\Workspace\blog\angularapp>ncu  
Using B:\Workspace\blog\angularapp\package.json  
[..................] \ :  
 @angular-devkit/build-angular   ~0.7.0~0.8.5  
 @angular/cli                    ~6.1.1~6.2.5  
 @types/node                     ~8.9.4~10.12.0  
 codelyzer                       ~4.2.1~4.5.0  
 jasmine-core                   ~2.99.1~3.2.1  
 karma                           ~1.7.1~3.0.0  
 karma-jasmine-html-reporter     ^0.2.2^1.3.1  
 protractor                      ~5.3.0~5.4.1  
 ts-node                         ~5.0.1~7.0.1  
 tslint                          ~5.9.1~5.11.0  
 typescript                      ~2.7.2~3.1.3  
  
Run `ncu` with `-u` to upgrade package.json  

It just displays the versions to the console and did not update to package.json. Next, update each dependency in package.json to the latest versions

Here is a single command to update all package’s current versions to the latest version.

B:\Workspace\blog\angularapp>ncu -u  
Using B:\Workspace\blog\angularapp\package.json  
[..................] \ :  
 @angular-devkit/build-angular   ~0.7.0  →    ~0.8.5  
 @angular/cli                    ~6.1.1  →    ~6.2.5  
 @types/node                     ~8.9.4  →  ~10.12.0  
 codelyzer                       ~4.2.1  →    ~4.5.0  
 jasmine-core                   ~2.99.1  →    ~3.2.1  
 karma                           ~1.7.1  →    ~3.0.0  
 karma-jasmine-html-reporter     ^0.2.2  →    ^1.3.1  
 protractor                      ~5.3.0  →    ~5.4.1  
 ts-node                         ~5.0.1  →    ~7.0.1  
 tslint                          ~5.9.1  →   ~5.11.0  
 typescript                      ~2.7.2  →    ~3.1.3  
  
Upgraded B:\Workspace\blog\angularapp\package.json  

It will update the dependency version to the latest version in package.json. Here is updated package.json files

{  
  "name": "angularapp",  
  "version": "0.0.0",  
  "scripts": {  
    "ng": "ng",  
    "start": "ng serve",  
    "build": "ng build",  
    "test": "ng test",  
    "lint": "ng lint",  
    "e2e": "ng e2e"  
  },  
  "private": true,  
  "dependencies": {  
    "@angular/animations": "^6.1.0",  
    "@angular/common": "^6.1.0",  
    "@angular/compiler": "^6.1.0",  
    "@angular/core": "^6.1.0",  
    "@angular/forms": "^6.1.0",  
    "@angular/http": "^6.1.0",  
    "@angular/platform-browser": "^6.1.0",  
    "@angular/platform-browser-dynamic": "^6.1.0",  
    "@angular/router": "^6.1.0",  
    "angular2-uuid": "^1.1.1",  
    "core-js": "^2.5.4",  
    "rxjs": "^6.0.0",  
    "zone.js": "~0.8.26"  
  },  
  "devDependencies": {  
    "@angular-devkit/build-angular": "~0.8.5",  
    "@angular/cli": "~6.2.5",  
    "@angular/compiler-cli": "^6.1.0",  
    "@angular/language-service": "^6.1.0",  
    "@types/jasmine": "~2.8.6",  
    "@types/jasminewd2": "~2.0.3",  
    "@types/node": "~10.12.0",  
    "codelyzer": "~4.5.0",  
    "jasmine-core": "~3.2.1",  
    "jasmine-spec-reporter": "~4.2.1",  
    "karma": "~3.0.0",  
    "karma-chrome-launcher": "~2.2.0",  
    "karma-coverage-istanbul-reporter": "~2.0.0",  
    "karma-jasmine": "~1.1.1",  
    "karma-jasmine-html-reporter": "^1.3.1",  
    "protractor": "~5.4.1",  
    "ts-node": "~7.0.1",  
    "tslint": "~5.11.0",  
    "typescript": "~3.1.3"  
  }  
}  

How do you update each package to the latest package version with the npm command?

npm command provides a single package to the latest

npm update --save  @angular/cli

The below runs and updates all packages in package.json

npm update

How to update dependencies to the latest versions in bower.json

Like a package.json package update, We can use the ncu command with the option -m

ncu -m bower.json  

Difference between npm update and npm-check-updates command?

npm-check-update check old versions and updates to the latest versions in package.json, next you have to install the latest packages using the npm install command.

npm update command updates the latest versions in package + install packages

Conclusion

To sum up, Learned how to update the latest npm packages in package.json and install them using npm update, ncu command.

THE BEST NEWSLETTER ANYWHERE
Join 6,000 subscribers and get a daily digest of full stack tutorials delivered to your inbox directly.No spam ever. Unsubscribe any time.

Similar Posts
Subscribe
You'll get a notification every time a post gets published here.