Question: how to invoke some script during ionic tasks

[aszmyd]

I have a question - is it possible to somehow nicely invoke some node script before ionic build and serve tasks? I want to generate config files based on environment and platform (android, ios). Earlier i've just made a gulp task like config and inject it into gulp tasks. Here we have package.json scripts:

"scripts": {
    "build": "ionic-app-scripts. build",
    "watch": "ionic-app-scripts watch",
    "serve:before": "watch",
    "emulate:before": "build",
    "deploy:before": "build",
    "build:before": "build",
    "run:before": "build"
},

I wanted to modify it like that:

"scripts": {
    "build": "node ./scripts/generate-config.js && ./node_modules/@ionic/app-scripts/bin/ionic-app-scripts.js build",
    "watch": "node ./scripts/generate-config.js && ./node_modules/@ionic/app-scripts/bin/ionic-app-scripts.js watch",
    "serve:before": "watch",
     ....
},

and it works but the issue is that generate-config.js script does not have access to initial command line arguments. I.e. when i run ionic build android --release i cannot figure out that the release option has been used. The same with any other initial arguments.

Is there DRY and nice way to achieve that?

[alan-agius4]

For the command flag/argument you can use yargs Its an amazing library.

In your generate-config.js place

const yargs = require("yargs");
const argv = yargs(JSON.parse(process.env.npm_config_argv).original)
    .default("release", false)
    .argv;

if (argv.release) {
 // code here
}

Also you can try the below

"scripts": {
    "prebuild": "node ./scripts/generate-config.js ",
    "build": "./node_modules/@ionic/app-scripts/bin/ionic-app-scripts.js build"
},

[aszmyd]

Unfortunately i couldn't make it work.
Having code You've suggested

const yargs = require("yargs");
const argv = yargs(JSON.parse(process.env.npm_config_argv).original)
    .default("release", false)
    .argv;

And package.json:

"scripts": {
    "ionic:serve": "node ./scripts/generate-config.js && ./node_modules/@ionic/app-scripts/bin/ionic-app-scripts.js serve"
  },

When i try to reach argv.release it always gets false. No matter what option i choose to invoke command:

ionic serve --release
ionic serve --release true
ionic serve --release=true
ionic serve --release="true"

[alan-agius4]

@aszmyd can you try to use this process.env.npm_package_config_release?

[aszmyd]

@alan-agius4 nope, process.env.npm_package_config_release is undefined. I suspect this has to do something with how ionic cli is invoking those npm scripts. In the end when i type i.e. ionic serve the ionic CLI is invoking scripts from package.json and they're managing the arguments etc.

[NoelDeMartin]

+1

I think this has to do with an issue I opened in the ionic-cli repository, I got a response from the ionic team there so you can view their opinion on the matter.

This is the issue: ionic-team/ionic-cli#1757

[aszmyd]

@NoelDeMartin yes it seems to be somehow related.
Meanwhile i've came to some kind of solution for my issue - using good old cordova hooks.
So i.e. i add to config.xml:

<hook type="before_build" src="scripts/some-action.js" />

And inside scripts/some-action.js:

#!/usr/bin/env node
module.exports = function(context) {
    ...
}

The context is described on cordova docs: https://cordova.apache.org/docs/en/latest/guide/appdev/hooks/#javascript
We can identify the building platform this way so make some additional steps. The dev/production environment can also be identified using context.opts.options array. If we build like ionic build android --prod --release those two prod and release flags will be in this array.

[NoelDeMartin]

@aszmyd Yes that's also what I did at the beginning, but it was a problem for me since I wanted to execute a script both in build and serve commands. Since serve command doesn't call any hooks, this created a situation where it was impossible not to duplicate code.

At the moment I have created my own wrapper for the ionic cli and I call all my scripts before passing the functionality to ionic, but I understand this is not necessary in all projects, cordova hooks and app scripts should work in most situations.

[danbucholtz]

We probably aren't going to get to this for awhile.

Thanks,
Dan

[pbowyer]

I ran into this a couple of days ago and I'm still looking for a work-around. I have a custom webpack config and passing arguments to ionic serve works perfectly - but the arguments are never passed through when using ionic cordova build.

I could use environment variables, but setting these cross-platform is not fun. Did anyone come up with a solution?

PoC repository: https://github.com/pbowyer/ionic-cascading-config