npm scripts not triggered for ionic-cli 3.x

[begriffin]

Just a quick note for updated ionic-app-scripts. You need to change the scripts section in package.json to:

"ionic:build:before": "ionic2-custom-icons",
"ionic:serve:before": "ionic2-custom-icons",

[GerritErpenstein]

Hi @begriffin! I'm a little bit confused. Where do these script keys come from? After changing the script keys ionic2-custom-icons isn't triggered anymore. I am using @ionic/app-scripts 1.3.4 and ionic-cli 2.2.2.

[begriffin]

I have @ionic/app-scripts 1.3.1 and ionic-cli 3.0.0-beta7

I just took a guess at the keys after digging through things and not finding any reason why I was getting the error: line: 1 File to import not found or unreadable: .tmp-custom-icons/scss/variables.scss Parent style sheet: stdin

When I changed to the ionic:build:before and ionic:serve:before everything worked great.

[GerritErpenstein]

Maybe there was a change in ionic-cli 3.x. I will check that tomorrow. Thank you very much for the report!

[GerritErpenstein]

After switching to ionic-cli 3.0.0-beta7 the scripts aren't triggered at all. None of the following seem to work:

"build:before": "ionic2-custom-icons",
"serve:before": "ionic2-custom-icons",
"ionic:build:before": "ionic2-custom-icons",
"ionic:serve:before": "ionic2-custom-icons",

Actually any script is ignored, even ionic:build and ionic:serve. This might be related to the following issue: https://github.com/driftyco/ionic-cli/issues/1989

But I don't understand why this works for you if you change the script names!?

I think I will have to spend some time to investigate this...

[GerritErpenstein]

As I couldn't find any code that implements this feature in ionic-cli 3.x I have opened an issue: https://github.com/driftyco/ionic-cli/issues/2124 Let's hope the ionic team resolves this issue soon.

[ThorvaldAagaard]

I have upgraded to Ionic CLI 3.1.2 and the suddenly realised that this plugin no longer was building during build of my app.

But for others in the same situation there is a simple solution until the proper hook will be available.

Just execute:

npm run prebuild

Then you will manually have to remember if the icons have been updated :-)

[davyzhang]

npm run ionic2-custom-icons

should do the trick

[ThorvaldAagaard]

Yes, you are right. I was assuming that you had updated package.json according to the istallation guide, så I had this in my file

"scripts": {
    "prebuild": "ionic2-custom-icons",

I also realised that running

npm run build 

would build all

[GerritErpenstein]

Good news! The Ionic team provides a solution very soon. :-) See the last messages in the corresponding issue thread: https://github.com/ionic-team/ionic-cli/issues/1989#issuecomment-306338187

[mwiley63]

It looks like the new CLI (3.4) now resolves this issue: https://github.com/ionic-team/ionic-cli/blob/master/CHANGELOG.md

Would an acceptable integration be "ionic:build:before": "ionic2-custom-icons" in the scripts section?

[Gemeapp]

It is working fine with

"ionic:build:before": "ionic2-custom-icons"

Is there a way to get output from the build?

Now the result looks like this

npm run ionic:build:before ✔ Running command - done!

[mwiley63]

If you are lazy like me you could add "ci-icons": "ionic2-custom-icons" to scripts in package.json and run with npm run ci-icons.

I use that as a sanity check before I start release builds :)

However since 3.4 supports gulp tasks, a better solution would be to hook the gulp task into the CLI events and then you could control the outputs and errors.

[GerritErpenstein]

Npm script hooks have been fixed in ionic-cli v3 (see https://github.com/ionic-team/ionic-cli/issues/2124#event-1112194403) The docs are here: https://github.com/ionic-team/ionic-cli#cli-hooks To enable these hooks for ionic2-custom-icons just use ionic:watch:before and ionic:build:before (instead of serve:before and build:before). Make sure you have the latest version of ionic-cli.

Sounds like @Gemeapp got it working! :smile: Are you sure you are using the latest version of ionic-cli and the script call does not generate any console output? If this is the case, I will file another issue report. Nevertheless this is good news! As an interim solution, I could make the npm script pipe the console output into a log file.

Unfortunately I'm on a hiking trip right now and don't have access to a dev machine to test it and make changes except updating the docs.

[GerritErpenstein]

@begriffin @ThorvaldAagaard @davyzhang @mwiley63 Can anyone of you confirm @Gemeapp 's findings that there is no console output?

[ThorvaldAagaard]

Alias Gemeapp :-)

This is ionic info

global packages:

@ionic/cli-utils : 1.4.0
Cordova CLI      : 7.0.1
Ionic CLI        : 3.4.0

local packages:

@ionic/app-scripts              : 1.3.7
@ionic/cli-plugin-cordova       : 1.4.0
@ionic/cli-plugin-ionic-angular : 1.3.1
Cordova Platforms               : android 6.2.3 ios 4.4.0
Ionic Framework                 : ionic-angular 2.2.0

System:

Node       : v6.9.5
OS         : Windows 10
Xcode      : not installed
ios-deploy : not installed
ios-sim    : not installed
npm        : 3.10.9

And there is no output from the

"ionic:build:before": "ionic2-custom-icons",

[GerritErpenstein]

@ThorvaldAagaard Thanks! I have reported the issue to the Ionic team. https://github.com/ionic-team/ionic-cli/issues/2124#issuecomment-308484986

[GerritErpenstein]

Using the latest alpha release of ionic-cli, the issue seems to be resolved. Install it (at your own risk) with the following command:

npm install -g ionic@3.4.0-alpha.e838a5d7

Don't forget to update when a new stable release becomes available!

[GerritErpenstein]

The hooks work for ionic-cli 3.5.0. The docs have been updated: https://github.com/GerritErpenstein/ionic2-custom-icons/blob/master/docs/CONFIGURATION.md#11-add-npm-scripts