I recently received an ionic app that hasn't been updated for quite some time. What steps did I do to unpack this situation and as a minimum get the packages updated?
To start, I did a quick check on the number of packages missing or outdated can be discovered through using the command:
npm outdated
Reponse from command:
Package Current Wanted Latest Location Depended by
@angular/common MISSING 10.2.5 13.3.0 - SAFS
@angular/core MISSING 10.2.5 13.3.0 - SAFS
@angular/fire MISSING 6.1.5 7.3.0 - SAFS
@angular/forms MISSING 10.2.5 13.3.0 - SAFS
@angular/http MISSING 7.2.16 7.2.16 - SAFS
@angular/platform-browser MISSING 10.2.5 13.3.0 - SAFS
@angular/platform-browser-dynamic MISSING 10.2.5 13.3.0 - SAFS
@angular/pwa MISSING 0.1002.1 13.3.0 - SAFS
@angular/router MISSING 10.2.5 13.3.0 - SAFS
@angular/service-worker MISSING 10.2.5 13.3.0 - SAFS
@asymmetrik/ngx-leaflet MISSING 5.0.2 13.0.2 - SAFS
@capacitor/android MISSING 1.5.3 3.4.3 - SAFS
@capacitor/cli MISSING 2.5.0 3.4.3 - SAFS
@capacitor/core MISSING 1.5.3 3.4.3 - SAFS
@capacitor/ios MISSING 1.5.3 3.4.3 - SAFS
@ionic-native/core MISSING 5.1.0 5.36.0 - SAFS
@ionic-native/http MISSING 5.36.0 5.36.0 - SAFS
@ionic-native/splash-screen MISSING 5.1.0 5.36.0 - SAFS
@ionic-native/status-bar MISSING 5.36.0 5.36.0 - SAFS
@ionic/angular MISSING 5.9.3 6.0.12 - SAFS
@ionic/storage MISSING 2.3.1 3.0.6 - SAFS
cordova-browser MISSING 5.0.4 6.0.0 - SAFS
cordova-plugin-advanced-http MISSING 2.0.1 3.2.2 - SAFS
cordova-plugin-device MISSING 2.0.2 2.0.3 - SAFS
cordova-plugin-file MISSING 6.0.2 6.0.2 - SAFS
cordova-plugin-ionic-keyboard MISSING 2.2.0 2.2.0 - SAFS
cordova-plugin-ionic-webview MISSING 2.5.3 5.0.0 - SAFS
cordova-plugin-splashscreen MISSING 5.0.2 6.0.0 - SAFS
cordova-plugin-statusbar MISSING 2.4.2 3.0.0 - SAFS
cordova-plugin-whitelist MISSING 1.3.3 1.3.5 - SAFS
core-js MISSING 2.6.12 3.21.1 - SAFS
firebase MISSING 8.10.1 9.6.9 - SAFS
leaflet MISSING 1.7.1 1.7.1 - SAFS
rxjs MISSING 6.6.3 7.5.5 - SAFS
tslib MISSING 1.14.1 2.3.1 - SAFS
zone.js MISSING 0.10.3 0.11.5 - SAFS
Installing missing packages
Using the command
npm install -g npm-install-missing
However, post this command when I ran the npm outdated command I had the same response. So no change!
This time, I am going to test by running the following sequence on a few of the npm packages:
rm of your node modules (at least the one that is concerned)
npm cache clean
run "npm install" several times, until all dependencies are resolved and no message are displayed
The packages I'll first test this function on will be
@angular/common
@angular/core
@angular/fire
@angular/forms
Nup, nothing would give. So my next step was to install packages starting from the top
npm i @angular/core
npm i @angular/common
npm i @angular/fire
npm i @angular/forms
npm i @angular/platform-browser
npm i @angular/platform-browser-dynamic
npm i @angular/pwa
npm i @angular/router
npm i @angular/service-worker
npm i @asymmetrik/ngx-leaflet
npm i @capacitor/android
npm i @ionic-native/core
npm i @ionic-native/http
npm i @ionic-native/splash-screen
npm i @ionic-native/status-bar
npm i @ionic/angular
npm i @ionic/storage
npm i core-js
npm i firebase
npm i leaflet
npm i rxjs
npm i tslib
npm i zone.js
npm i cordova-browser
npm i cordova-plugin-advanced-http
npm i cordova-plugin-device
npm i cordova-plugin-file
npm i cordova-plugin-ionic-keyboard
npm i cordova-plugin-ionic-webview
npm i cordova-plugin-splashscreen
npm i cordova-plugin-statusbar
npm i cordova-plugin-whitelist
dev dependancies
npm i -D @angular/cli
npm i -D @angular/compiler
npm i -D @angular/compiler-cli
npm i -D @angular/language-service
npm i -D @angular-devkit/architect
npm i -D @angular-devkit/build-angular
npm i -D @angular-devkit/core
npm i -D @angular-devkit/schematics
npm i -D codelyzer
npm i -D eslint
npm i -D protractor
npm i -D ts-node
npm i -D typescript
npm i -D karma
npm i -D karma-chrome-launcher
npm i -D karma-coverage-istanbul-reporter
npm i -D karma-jasmine
npm i -D karma-jasmine-html-reporter
npm i -D cordova-sqlite-storage
npm i -D jasmine-core
npm i -D jasmine-spec-reporter
npm i -D @ionic/angular-toolkit
npm i -D @ionic/lab
npm i -D @types/jasmine
npm i -D @types/jasminewd2
npm i -D @types/leaflet
npm i -D @types/node
Some might have noticed that there are packages in the list with a different name. Any of these were a result of the original being deprecated. By way of example, tslint I replaced with eslint.
Does it work?
Post manually updating the above packages, running the command
npm outdated
Produced a response of null. However, that doesn't mean the code will now work. More that of the packages uploaded, there are none that are badly out of date. This is not surprising, as I had to delete all packages first so I could install each of the npm packages again.