Andrew Fletcher published: 27 April 2022 3 minutes read
How can you find out if the Cordova plugins have been loaded?
Begin by running the command
ionic info
You will see a response similar to
❯ ionic info
Ionic:
Ionic CLI : 6.19.0 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 6.1.2
@angular-devkit/build-angular : 13.3.3
@angular-devkit/schematics : 13.3.3
@angular/cli : 13.3.3
@ionic/angular-toolkit : 6.1.0
Capacitor:
Capacitor CLI : 3.4.3
@capacitor/android : 3.4.3
@capacitor/core : 3.4.3
@capacitor/ios : 3.4.3
Cordova:
Cordova CLI : 11.0.0
Cordova Platforms : none
Cordova Plugins : no whitelisted plugins (0 plugins total)
Utility:
cordova-res : not installed globally
native-run : 1.5.0
System:
ios-deploy : 1.11.4
ios-sim : ios-sim/9.0.0 darwin-x64 node-v17.4.0
NodeJS : v17.4.0 (/usr/local/Cellar/node/17.4.0/bin/node)
npm : 8.5.5
OS : macOS Big Sur
Xcode : Xcode 13.2.1 Build version 13C100
Note, under Cordova platforms states none and there are zero plugins in total being used. Whereas, instead it should look more like
Cordova:
Cordova CLI : 11.0.0
Cordova Platforms : android 10.1.2, browser 6.0.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 7 other plugins)
How to fix
Run the command
cordova prepare
Running this command, the response is
Discovered platform "browser". Adding it to the project
Using cordova-fetch for cordova-browser@6.0.0
Adding browser project...
Creating Cordova project for cordova-browser:
Path: /Users/andrewfletcher/Apps/{project}/SAFS/platforms/browser
Name: SAFS
Discovered platform "android". Adding it to the project
Using cordova-fetch for cordova-android@^10.1.2
Adding android project...
Creating Cordova project for the Android platform:
Path: platforms/android
Package:{package}
Name: SAFS
Activity: MainActivity
Android target: android-30
Subproject Path: CordovaLib
Subproject Path: app
Android project created with cordova-android@10.1.2
Discovered plugin "cordova-plugin-advanced-http". Adding it to the project
Installing "cordova-plugin-advanced-http" for android
Installing "cordova-plugin-file" for android
Subproject Path: CordovaLib
Subproject Path: app
The Android Persistent storage location now defaults to "Internal". Please check this plugin's README to see if your application needs any changes in its config.xml.
If this is a new application no changes are required.
If this is an update to an existing application that did not specify an "AndroidPersistentFileLocation" you may need to add:
"<preference name="AndroidPersistentFileLocation" value="Compatibility" />"
to config.xml in order for the application to find previously stored files.
Installing "cordova-plugin-advanced-http" for browser
Plugin dependency "cordova-plugin-file@7.0.0" already fetched, using that version.
Installing "cordova-plugin-file" for browser
config file config.xml requested for changes not found at /Users/andrewfletcher/Apps/{project/SAFS/platforms/browser/config.xml, ignoring
Discovered plugin "cordova-plugin-whitelist". Adding it to the project
Installing "cordova-plugin-whitelist" for android
Plugin doesn't support this project's cordova-android version. cordova-android: 10.1.2, failed version requirement: >=4.0.0 <10.0.0
Skipping 'cordova-plugin-whitelist' for android
Installing "cordova-plugin-whitelist" for browser
Discovered plugin "cordova-plugin-statusbar". Adding it to the project
Installing "cordova-plugin-statusbar" for android
Installing "cordova-plugin-statusbar" for browser
Discovered plugin "cordova-plugin-device". Adding it to the project
Installing "cordova-plugin-device" for android
Installing "cordova-plugin-device" for browser
config file config.xml requested for changes not found at /Users/andrewfletcher/Apps/{project}/SAFS/platforms/browser/config.xml, ignoring
Discovered plugin "cordova-plugin-splashscreen". Adding it to the project
Installing "cordova-plugin-splashscreen" for android
Installing "cordova-plugin-splashscreen" for browser
Discovered plugin "cordova-plugin-ionic-webview". Adding it to the project
Installing "cordova-plugin-ionic-webview" for android
Installing "cordova-plugin-ionic-webview" for browser
Discovered plugin "cordova-plugin-ionic-keyboard". Adding it to the project
Installing "cordova-plugin-ionic-keyboard" for android
Installing "cordova-plugin-ionic-keyboard" for browser
Discovered plugin "cordova-sqlite-storage". Adding it to the project
Installing "cordova-sqlite-storage" for android
installing external dependencies via npm
for package name: cordova-sqlite-storage
npm install of external dependencies ok
Installing "cordova-sqlite-storage" for browser
installing external dependencies via npm
for package name: cordova-sqlite-storage
npm install of external dependencies ok
Check and test
RAs the Cordova plugins have been added to the project, run the Ionic info command again and confirm the response has been updated. Now showing something like
Cordova:
Cordova CLI : 11.0.0
Cordova Platforms : android 10.1.2, browser 6.0.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 7 other plugins)
Related articles
Andrew Fletcher
•
11 Oct 2023
Launching app code in a simulator like Xcode or Android Studio
Loading the code in a platform - in this article, I'll be focusing on Android and iOS. Ionic app shell prompts for iOS and Android devices. Here's a breakdown of the commands:npm run buildThis command is used to build your web app. It's typically associated with web development frameworks...
Andrew Fletcher
•
29 Sep 2023
Setting up an ionic app
Recently a client handed me code that runs an app through iOS and Android. No details about whether native or otherwise. Once I had the opportunity to crawl through the code, definitely not native. Typescript, Angular, Cordova... etc.Glancing at the modification dates, the last...
Andrew Fletcher
•
08 Aug 2022
How to update package.json dependencies to the latest version?
This article works through the steps to update dependencies in package.json file to the latest version.
Use npm-check-updates or npm outdated to suggest the latest versions.
npm-check-updates is a utility that automatically adjusts a package.json with the latest version of all...