Managing cordova plugins with npm + package.json

Question

We have an Angular + Ionic + Cordova project with several developers who we would like to manage the dependencies of cordova plugins on. We use Cordova CLI 5+ , and when manually running installation commands (for example, cordova plugin add cordova-plugin-camera ), a new line is added to the cordovaPlugins section in the package.json file. Here is the finished product:

 "cordovaPlugins": [ "cordova-plugin-camera", "cordova-plugin-console", "cordova-plugin-contacts", "cordova-plugin-device", "cordova-plugin-dialogs", "cordova-plugin-file", "cordova-plugin-geolocation", "cordova-plugin-media", "cordova-plugin-media-capture", "cordova-plugin-network-information", "cordova-plugin-splashscreen", "cordova-plugin-statusbar", "cordova-plugin-vibration", "com.ionic.keyboard" ] 

This is all wonderful if we cannot find any way for dev # 2 for npm to install these plugins - instead, it should run the commands individually and then add a duplicate line to package.json , polluting the repository. We are sure that there must be a command to install them, but cannot find it. Can anyone shed some light?

Answer 1

What caused our release

We initially used this Ionic + Cordova + Grunt seed project to launch our initial application. The project includes a number of Cordova hooks , which, among other things, add and remove platforms and plugins from the corresponding cordovaPlatforms and cordovaPlugins in package.json when the corresponding command is run (i.e. cordova plugin add cordova-plugin-media adds a line to cordovaPlugins )

In order to better support local testing (for example, try to use new versions of the plugin), as well as to prevent dependency problems between different users, we disabled the hook of the project project and now, if necessary, package.json manually.

Proper management of Cordoba plugins

In turn, the Ionic CLI uses package.json to control the state of the Cordova application in terms of platforms and plugins (as of version 1.3.19 , it appears).

Filling package.json with two sections, cordovaPlatforms and cordovaPlugins allowed us to make a simple ionic state restore to get the Cordoba environment in a form for emulation, building, etc.

Specifying Versions

To further block the state of the application and development environment, we also indicated the target version of the Cordova platforms and plugins that we use by adding the version number. Here we use:

 { ... "cordovaPlatforms": [ "android@4.0.2", "ios@3.8.0" ], "cordovaPlugins": [ "cordova-plugin-camera@1.1.0", "cordova-plugin-contacts@1.1.0", "cordova-plugin-device@1.0.1", "cordova-plugin-file@2.1.0", "cordova-plugin-media@1.0.1", "cordova-plugin-media-capture@1.0.1", "cordova-plugin-network-information@1.0.1", "cordova-plugin-splashscreen@2.1.0", "cordova-plugin-statusbar@1.0.1", "cordova-plugin-vibration@1.2.0", "com.ionic.keyboard@1.0.5" ] } 

TL; DR

After you have indicated above in your package.json , you can make sure that your local environment is in the correct state through ionic state restore (v1.3.19 +), which will scroll through package.json and install platforms and plugins as needed.

Answer 2

You can add the postinstall command. Look below

 { "cordovaPlugins": [ "com.ionic.keyboard@1.0.4", ], "cordovaPlatforms": [ "android@4.1.1", ], "scripts": { "postinstall": "ionic state restore", "clean": "ionic platform remove android; ionic platform remove ios; ionic platform remove browser; git checkout package.json" } } 

Bonus: use npm run clean followed by npm install if you want to start cleaning. Reinstall all platforms.

Answer 3

maybe it's a little late in the game, but this is my postinstall script

  "postinstall": "bower i && gulp && ionic state reset && ionic config build" 

• it sets up the bower dependencies, for example. ionic lib
• he rebuilds plugins of Cordoba
• it restores the configuration made using the ionic config command