ionic-cli: Ionic 2 : CLI "ionic resources" doesn't generate icon and splashscreen

Just tried it and it worked (used a new RC5 project). Execute the following commands:

$ cordova platform update android@6.1.0
$ ionic resources android

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.5
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 1.0.0
ios-deploy version: 1.9.0 
ios-sim version: 5.0.11 
OS: macOS Sierra
Node Version: v6.9.1
Xcode version: Xcode 8.2.1 Build version 8C1002

ionic platform rm android ionic platform add https://github.com/apache/cordova-android.git#master ionic resources --icon ionic resources --splash

… this fixed my woes…

Give us access to the code so we can fix it!

The supplied splash template is too large (2732x2732). When the size of the splash screen file is reduced to 2208x2208 it runs without a hitch.

I am experiencing the same issue, resources are generated but I cannot see them on android.

For the icon to work I did this:

ionic platform rm android
ionic platform add https://github.com/apache/cordova-android.git#master

but still the splash is not showing

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.2
Ionic CLI Version: 2.1.8
Ionic App Lib Version: 2.1.4
Ionic App Scripts Version: 0.0.43
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.6.0
Xcode version: Not installed

@0x1ad2 Works perfectly.

@0x1ad2 +1

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: 5.0.13 
OS: OS X Yosemite
Node Version: v4.4.5
Xcode version: Xcode 7.2.1 Build version 7C1002

If you are with IONIC2.1.13 like me, Put a splash size at 2732 x 2732 and the icon size at 192 x192. update your android plateform with cordova platform update android@6.1.0 and execute the ionic resources . I suddgest you to copie all the res folder generated from the plateform/android and save it somewhere if in the future you face the same problem. In my case i had to come back with the command cordova platform update android@6.0.0 before to be able to build my project again and i’m now working with no issue.

same issue for me too

ionic platform rm android ionic platform add https://github.com/apache/cordova-android.git#master ionic resources --icon

saves the day

ionic platform rm android ionic platform add https://github.com/apache/cordova-android.git#master ionic resources --icon ionic resources --splash

Fixed my issues too, i don’t understand why ionic add platform android doesn’t support icon and splashcreen now… I’m using: Cordova CLI: 6.4.0 Ionic CLI Version: 1.3.1 Ionic App Lib Version: 2.1.4 OS: Windows 10 Node Version: v6.9.1

For anyone experiencing the same issue - Splash screen not showing even though the resources are present. You need to know that to be able to show your splash screen you need to un-satisfy this condition

if (drawableId == 0 || (splashscreenTime <= 0 && hideAfterDelay)) {
    return;
}

So in this case you need to put this on your config.xml

<preference name="SplashScreenDelay" value="3000"/>

Set a SplashScreenDelay , do not leave it on 0 (This will disable your splashscreen). You can set the SplashScreenDelay to a long time then hide the splash in ionic.

  initializeApp() {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();
      Splashscreen.hide();
    });
  }

You need to import this:

import { Splashscreen } from 'ionic-native';

We recently released a new version of the CLI that should resolve the resources issues. Could you please update your CLI to at least 2.1.4?

npm install -g ionic@latest

Thank you!

Why do they need our assets?

This shouldn’t have a cache at all; executing the commands should mark the cached assets stale prior to the new workflow, so the result is deterministic.

I have the same problem, I tried with ionic client v1 and v2 beta. If the image is too big it doesn’t complete the resources task for neither icon or splash. Reducing to 2200px as suggested by some users worked, also selecting only icon generation worked.

Actually the images are uploaded to the server and generated also using a 2732px image, and you can find the resulting images in your temp folder (with a different name) but they are not copied to the resources folder.

Also consider modifying the code that generates the images to use a local imagemagick instance if available and fallback to the server if there is none, I don’t understand the need to upload 2mb images and to download ~10mb if it could be done locally.

For me it worked doing it with individually, i.e. ionic resources --icon

Hugo Cardoza

2016-07-13 4:16 GMT-05:00 kabbi notifications@github.com:

U can try it with ionic1 cli

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/driftyco/ionic-cli/issues/1166#issuecomment-232301947, or mute the thread https://github.com/notifications/unsubscribe/AA21euWBNMcN39-_Zxay2WRkXTs0tEHdks5qVK0JgaJpZM4JJs4m .

@evandrojr Nice, thanks. I’ll give it a try.

Hi Jimi try https://github.com/AlexDisler/cordova-icon

Works well

Em 14/12/2016 04:58, “jimiatworking” notifications@github.com escreveu:

@evandrojr https://github.com/evandrojr hi, I would like to know which cordova pluin you use to generate icon and splash? I have problem “Unable to generate images due to an error Invalid upload: image too large: 39002607”

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/driftyco/ionic-cli/issues/1166#issuecomment-266967741, or mute the thread https://github.com/notifications/unsubscribe-auth/AA5WWOESH5gI7JOR9J3IlT8e-dn0C6HVks5rH6GngaJpZM4JJs4m .

Finally I got it simple working with this small script in hooks/after_build:

#!/usr/bin/env node

'use strict';

var ncp = require('ncp');

ncp('./res', './platforms/android/res', function(e){
	if(e) {
		return console.log('res copy error', e);
	} else {
		return console.log('res copied');
	}
});

You have to install ncp with: npm install ncp also

Hi!

I was able to get “ionic resources --icon” to work on the latest Ionic CLI version 2.1.8 and Ionic Framework Version: 2.0.0-rc.2.

However, still could not see the updated icon on the Emulator or the Device – until after I figured out why.

My solution was to replace the icon.png files in the platforms/android/res/mipmap-* folder with the new images. I used makeappicon.com to generate icon files (which I then renamed to icon.png).

Seems like this is an issue in either Ionic or Cordova. I will file a new issue as relevant.

I’m having the same problem on Mac OS X El Capitan, even with the ionic@latest update. If I look through the resources/android/icon directory, I can see the icon and splash files have been generated, but I still only get the default icon. I’ve tried deleting the android-debug.apk file and rebuilding, and though I can see the files in the res directory under the platform/android directory, these changes are not being reflected in the app.

I generated the layout using Ionic Creator, if that makes any difference.

+1

+1 for using a local imagemagick if it is available.

For the --splash generating I could only use an image as big as ~2400px. Resized down from ~2900px. Not sure what the limit is on file size, but it is confusing as I had been following this tutorial which suggests a minimum 2208x2208 for the splash image.

@Brieg it was already solved in 6.1.0 as I mentioned. Any chance you could close this issue @mhartington?

+1 icon and splash not copied to /platforms/android/res getting crazy of it!

See latest at https://github.com/driftyco/ionic-cli/issues/1683

+1

2800*2800 32 bit 10.3 Mega worked fine with me ! 😃

Any update?

so basically i think i got splash working by making a full square 2208x2208, which looks weird. different sized (W-H) .psd’s don’t seem to work, and it didn’t even generate the tablet ones.

i can’t provide icons or splashes, everything copyrighted here.

ionic resources --icon works ionic resources -splash does not Sequence looks weird, first it extracts files from the cache, then it uploads the .ai file…

OK I finally managed to generate the resources! The problem was on the file format of my custom icon.png and splash.png images. I had them created using powerpoint (save as picture…) with a .png format but they weren’t valid. Here are the steps I took and from now on it always works.

1. First of all confirm that when you use the default icon.png and splash.png images the ionic resources command works as intended.
2. Compare on this site your custom .png files with the defaults respectively. Here is where I got a .png extension for the default files but unknown for my custom ones (some weird characters actually). If the site doesn’t work just find another one or simply skip this step.
3. In case your custom .png found invalid (unknown extension) convert them here.
4. Use the new files and test.

It make sense if ionic’s image service validates the .png files before generate the resources. Here’s my ionic info.

Cordova CLI: 6.3.0                                                                                                              
Gulp version:  CLI version 3.9.0                                                                                                
Gulp local:   Local version 3.9.1                                                                                               
Ionic Framework Version: 2.0.0-beta.11                                                                                          
Ionic CLI Version: 2.0.0-beta.35                                                                                                
Ionic App Lib Version: 2.0.0-beta.19                                                                                            
OS:                                                                                                                             
Node Version: v6.2.1