Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Icons and Splash images for your Cordova project. (with iOS 7 support)

Usage

Install cordova into node_modules

npm install cordova

Add icons_and_splash.js

Copy icons_and_splash.js into the .cordova/hooks/after_prepare directory.

It also needs to be executable: chmod +x .cordova/hooks/after_prepare/icons_and_splash.js

Add this to your config.xml

<icon src="res/icons/" />

Add these files to your www directory

www/res
`-- icons
    |-- android
    |   |-- icon-36-ldpi.png
    |   |-- icon-48-mdpi.png
    |   |-- icon-72-hdpi.png
    |   `-- icon-96-xhdpi.png
    `-- ios
        |-- icon-29-2x.png
        |-- icon-29.png
        |-- icon-40-2x.png
        |-- icon-40.png
        |-- icon-50-2x.png
        |-- icon-50.png
        |-- icon-57-2x.png
        |-- icon-57.png
        |-- icon-60-2x.png
        |-- icon-60.png
        |-- icon-72-2x.png
        |-- icon-72.png
        |-- icon-76-2x.png
        `-- icon-76.png

Report any error

If you get any error, please report error in comments here. I will then try to fix and update this gist accordingly. Please help us take away the pain in adding a custom icon to our applications.

#
# (Windows)
#
# What is this?
#
# It's a shell script that is using ImageMagick to create all the icon files from one source icon.
#
# If you'd like to use it on windows install ImageMagick:
# http://www.imagemagick.org/script/binary-releases.php#windows
#
# Stick the script in your 'www/res/icons' folder with your source icon 'my-hires-icon.png' then trigger it from Command Prompt.
#
mkdir android
convert my-hires-icon.png -resize 36x36 android/icon-36-ldpi.png
convert my-hires-icon.png -resize 48x48 android/icon-48-mdpi.png
convert my-hires-icon.png -resize 72x72 android/icon-72-hdpi.png
convert my-hires-icon.png -resize 96x96 android/icon-96-xhdpi.png
mkdir ios
convert my-hires-icon.png -resize 29 ios/icon-29.png
convert my-hires-icon.png -resize 40 ios/icon-40.png
convert my-hires-icon.png -resize 50 ios/icon-50.png
convert my-hires-icon.png -resize 57 ios/icon-57.png
convert my-hires-icon.png -resize 58 ios/icon-29-2x.png
convert my-hires-icon.png -resize 60 ios/icon-60.png
convert my-hires-icon.png -resize 72 ios/icon-72.png
convert my-hires-icon.png -resize 76 ios/icon-76.png
convert my-hires-icon.png -resize 80 ios/icon-40-2x.png
convert my-hires-icon.png -resize 100 ios/icon-50-2x.png
convert my-hires-icon.png -resize 114 ios/icon-57-2x.png
convert my-hires-icon.png -resize 120 ios/icon-60-2x.png
convert my-hires-icon.png -resize 144 ios/icon-72-2x.png
convert my-hires-icon.png -resize 152 ios/icon-76-2x.png
#
# (OS X, Unix and Linux)
#
# What is this?
#
# It's a shell script that is using ImageMagick to create all the icon files from one source icon.
#
# Stick the script in your 'www/res/icons' folder with your source icon 'my-hires-icon.png' then trigger it from Terminal.
#
ICON=${1:-"my-hires-icon.png"}
mkdir android
convert $ICON -resize 36x36 android/icon-36-ldpi.png
convert $ICON -resize 48x48 android/icon-48-mdpi.png
convert $ICON -resize 72x72 android/icon-72-hdpi.png
convert $ICON -resize 96x96 android/icon-96-xhdpi.png
mkdir ios
convert $ICON -resize 29 ios/icon-29.png
convert $ICON -resize 40 ios/icon-40.png
convert $ICON -resize 50 ios/icon-50.png
convert $ICON -resize 57 ios/icon-57.png
convert $ICON -resize 58 ios/icon-29-2x.png
convert $ICON -resize 60 ios/icon-60.png
convert $ICON -resize 72 ios/icon-72.png
convert $ICON -resize 76 ios/icon-76.png
convert $ICON -resize 80 ios/icon-40-2x.png
convert $ICON -resize 100 ios/icon-50-2x.png
convert $ICON -resize 114 ios/icon-57-2x.png
convert $ICON -resize 120 ios/icon-60-2x.png
convert $ICON -resize 144 ios/icon-72-2x.png
convert $ICON -resize 152 ios/icon-76-2x.png
#!/usr/bin/env node
var cordova_util = require('cordova/src/util');
var projectRoot = cordova_util.isCordova(process.cwd());
var projectXml = cordova_util.projectConfig(projectRoot);
var projectConfig = new cordova_util.config_parser(projectXml);
var projectPlatforms = cordova_util.listPlatforms(projectRoot);
projectConfig.name();
var fs = require ('fs');
var platformDir = {
ios: {
icon: "{$projectName}/Resources/icons",
splash: "{$projectName}/Resources/splash",
nameMap: {
// iOS >= 7 Settings icon
// iOS <= 6.1 Small icon for Spotlight search results and Settings (recommended) iPhone
"icon-29.png": "icon-small.png",
"icon-29-2x.png": "icon-small@2x.png",
// iOS >= 7 Spotlight search results icon (recommended)
"icon-40.png": "icon-40.png",
"icon-40-2x.png": "icon-40@2x.png",
// iOS <= 6.1 Small icon for Spotlight search results and Settings (recommended) iPad
"icon-50.png": "icon-50.png",
"icon-50-2x.png": "icon-50@2x.png",
// iOS <= 6.1 App icon (required) iPhone
"icon-57.png": "icon.png",
"icon-57-2x.png": "icon@2x.png",
// iOS >= 7 App icon (required) iPhone
"icon-60.png": "icon-60.png",
"icon-60-2x.png": "icon-60@2x.png",
// iOS <= 6.1 App icon (required) iPad
"icon-72.png": "icon-72.png",
"icon-72-2x.png": "icon-72@2x.png",
// iOS 7 App icon (required) iPad
"icon-76.png": "icon-76.png",
"icon-76-2x.png": "icon-76@2x.png",
// "screen-iphone-landscape.png": "Default~iphone.png",
"screen-ipad-portrait.png": "Default-Portrait~ipad.png",
"screen-ipad-portrait-2x.png": "Default-Portrait@2x~ipad.png",
"screen-ipad-landscape-2x.png": "Default-Landscape@2x~ipad.png",
"screen-ipad-landscape.png": "Default-Landscape~ipad.png",
"screen-iphone-portrait.png": "Default~iphone.png",
"screen-iphone-portrait-2x.png": "Default@2x~iphone.png",
"screen-iphone-portrait-568h-2x.png": "Default-568h@2x~iphone.png"
}
},
android: {
icon:"res/drawable-{$density}",
splash:"res/drawable-{$density}",
nameMap: {
"icon-36-ldpi.png": "icon.png",
"icon-48-mdpi.png": "icon.png",
"icon-72-hdpi.png": "icon.png",
"icon-96-xhdpi.png": "icon.png",
"screen-ldpi-portrait.png": "ic_launcher.png",
"screen-mdpi-portrait.png": "ic_launcher.png",
"screen-hdpi-portrait.png": "ic_launcher.png",
"screen-xhdpi-portrait.png": "ic_launcher.png"
}
},
blackberry10: {},
wp7: {},
wp8: {}
}
function copyAsset (scope, node) {
var platform = node.attrib['gap:platform'];
var density = node.attrib['gap:density'];
var assetDirTmpl = platformDir[platform] && platformDir[platform][scope];
if (!assetDirTmpl) {
throw new Error('Platform and density not supported: ' + platform + ', ' + density);
}
var dict = {
projectName: projectConfig.name(),
density: density
};
var assetDir = assetDirTmpl.replace(/{\$([^}]+)}/, function (match, p1) {
return dict[p1];
});
var srcPath = 'www/'+node.attrib.src;
var fileName = srcPath.match(/[^\/]+$/)[0];
if (platformDir[platform] && platformDir[platform].nameMap && platformDir[platform].nameMap[fileName]) {
fileName = platformDir[platform].nameMap[fileName];
} else {
throw new Error('Unknown icon name for platform ' + platform);
}
var dstPath = 'platforms/'+platform+'/'+assetDir+'/'+fileName;
console.log ('copying from '+srcPath+' to the '+dstPath);
// so, here we start to copy asset
fs.stat (srcPath, function (err, stats) {
if (err) {
throw err;
}
var r = fs.createReadStream(srcPath);
r.on ('open', function () {
r.pause();
var w = fs.createWriteStream(dstPath);
w.on ('open', function () {
r.pipe(w);
r.resume();
});
w.on ('error', function() {
throw new Error('Cannot write file');
})
});
r.on ('error', function() {
throw new Error('Cannot read file');
});
});
}
projectConfig.doc.findall('icon').map(function (node) {
if (/\/$/.test(node.attrib['src']) && node.attrib['gap:platform'] === undefined && node.attrib['gap:density'] === undefined) {
if (~projectPlatforms.indexOf('android')) {
// Android
copyAsset('icon', { attrib: { 'gap:platform': 'android', src: node.attrib.src + 'android/icon-36-ldpi.png', 'gap:density': 'ldpi' } });
copyAsset('icon', { attrib: { 'gap:platform': 'android', src: node.attrib.src + 'android/icon-48-mdpi.png', 'gap:density': 'mdpi' } });
copyAsset('icon', { attrib: { 'gap:platform': 'android', src: node.attrib.src + 'android/icon-72-hdpi.png', 'gap:density': 'hdpi' } });
copyAsset('icon', { attrib: { 'gap:platform': 'android', src: node.attrib.src + 'android/icon-96-xhdpi.png', 'gap:density': 'xhdpi' } });
}
if (~projectPlatforms.indexOf('ios')) {
// iOS >= 7 Settings icon
// iOS <= 6.1 Small icon for Spotlight search results and Settings (recommended) iPhone
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-29.png' } });
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-29-2x.png' } });
// iOS >= 7 Spotlight search results icon (recommended)
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-40.png' } });
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-40-2x.png' } });
// iOS <= 6.1 Small icon for Spotlight search results and Settings (recommended) iPad
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-50.png' } });
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-50-2x.png' } });
// iOS <= 6.1 App icon (required) iPhone
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-57.png' } });
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-57-2x.png' } });
// iOS >= 7 App icon (required) iPhone
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-60.png' } });
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-60-2x.png' } });
// iOS <= 6.1 App icon (required) iPad
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-72.png' } });
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-72-2x.png' } });
// iOS 7 App icon (required) iPad
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-76.png' } });
copyAsset('icon', { attrib: { 'gap:platform': 'ios', src: node.attrib.src + 'ios/icon-76-2x.png' } });
}
} else {
copyAsset ('icon', node);
}
});
projectConfig.doc.findall('*').filter(function (node) {
return (node.tag == 'gap:splash');
}).map(function (node) {
copyAsset ('splash', node);
});
@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Nov 17, 2013

I'm also thinking of making a nice script to generate all the icons from one svg-file, please comment if you have any thoughts concerning this.

@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Nov 17, 2013

Just to clarify, this currently only support iOS and Android, patches for other platforms welcome!

@slaskis

This comment has been minimized.

Copy link

commented Nov 28, 2013

Icons work great! But how do I get the splash/screens to work?

@kunik

This comment has been minimized.

Copy link

commented Dec 5, 2013

Every time I run cordova build -d, I just see

hook file "/<path>/.cordova/hooks/after_prepare/icons_and_splash.js" skipped

And I don't see any result. What does it mean. How to get this hook working?

@synthecypher

This comment has been minimized.

Copy link

commented Dec 15, 2013

Works great but what baffles me is why I even need this script on 3.3.0-0.1.1 when in the docs it appears this should work without it?

Also for any novices wondering what that 'convert.sh' file is:

It's a shell script that appears to be using ImageMagick to creating all the icon files from a source icon.

If you'd like to use it on windows install ImageMagick:
http://www.imagemagick.org/script/binary-releases.php#windows

Then you should be able to use the same script by renaming it from 'convert.sh' to 'convert.bat'.

Stick the script in your 'www/res/icons' folder with your source icon 'my-hires-icon.png' then trigger it from Command Prompt.

@unexist

This comment has been minimized.

Copy link

commented Dec 17, 2013

Thanks for the nice script, there is one typo though:

throw new Error('Platform and densite not supported: ' + platform + ', ' + density);

Should be 'density' and not 'densite'. ;)

Edit: I'd also suggest to replace the errors with console output, because a default config includes icon/splash definitions for every supported platform.

@numediaweb

This comment has been minimized.

Copy link

commented Dec 22, 2013

What I couldn't understand is the cordova docs; one time they say to put the images in www/res/icons directory (www/res/screens subdirectory for splash), then they say something different in the same page ; platforms/android/res/drawable* directories :( could somebody explaine why should I put the icons in two different folders?
Thanks

@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Dec 31, 2013

(Sorry for late reply, didn't get any notifications...)

@slaskis The script dosen't have proper support yet but this should work:

<gap:platform gap:platform="ios" src="res/splash/ios/screen-iphone-portrait.png" />

The following files work for iOS:

screen-ipad-portrait.png
screen-ipad-portrait-2x.png 
screen-ipad-landscape-2x.png
screen-ipad-landscape.png 
screen-iphone-portrait.png
screen-iphone-portrait-2x.png
screen-iphone-portrait-568h-2x.png

And for Android:

<gap:platform gap:platform="android" gap:density="mdpi" src="res/splash/android/screen-mdpi-portrait.png" />
screen-ldpi-portrait.png
screen-mdpi-portrait.png
screen-hdpi-portrait.png
screen-xhdpi-portrait.png
@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Dec 31, 2013

(Sorry for late reply, didn't get any notifications...)

@kunik Are you sure that the file has the executable bit set?

chmod +x .cordova/hooks/after_prepare/icons_and_splash.js
@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Dec 31, 2013

(Sorry for late reply, didn't get any notifications...)

@synthecypher couldn't agree more, this is insane!

Thanks for the clarification on the convert.sh file, I added your comment in it, shout at me if you want it removed.

@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Dec 31, 2013

@unexist Thanks, I updated the typo.

My reasoning for using throw was that the user would report the error and we can add in support for more platforms as that happens.

@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Dec 31, 2013

@numediaweb To put it in the platforms/android/res/drawable* folders is the only thing that actually works, but that is bad since the platform folder is supposed to be generated and not checked in into git (or svn or whatever).

This script enables you to have your icons inside the www folder instead, as the manual says in the top.

@mytharcher

This comment has been minimized.

Copy link

commented Jan 7, 2014

The image path placeholder in convert command could be changed to $1, and then the usage could be:

$ sh convert.sh my-icon.png

I think this would be more flexiable so that no hard code in the script.

@LinusU

This comment has been minimized.

Copy link
Owner Author

commented Jan 23, 2014

@mytharcher, fixed

@niiamon

This comment has been minimized.

Copy link

commented Feb 25, 2014

I tried running the script but it blew up on me:

module.js:340
throw err;
^
Error: Cannot find module 'cordova/src/util'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object. (/Users/niiamon/projects/awsmsauce/atade/src/live/lukaduka-pos/lukaduka-pos/.cordova/hooks/after_prepare/icons_and_splash.js:3:20)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Function.Module.runMain (module.js:497:10)

Error: Script "/Users/niiamon/projects/awsmsauce/atade/src/live/lukaduka-pos/lukaduka-pos/.cordova/hooks/after_prepare/icons_and_splash.js" exited with status code 8. Aborting. Output:

module.js:340
throw err;
^
Error: Cannot find module 'cordova/src/util'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object. (/Users/niiamon/projects/awsmsauce/atade/src/live/lukaduka-pos/lukaduka-pos/.cordova/hooks/after_prepare/icons_and_splash.js:3:20)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Function.Module.runMain (module.js:497:10)

at /usr/local/lib/node_modules/cordova/src/hooker.js:141:34
at ChildProcess.exithandler (child_process.js:641:7)
at ChildProcess.EventEmitter.emit (events.js:98:17)
at maybeClose (child_process.js:735:16)
at Socket.<anonymous> (child_process.js:948:11)
at Socket.EventEmitter.emit (events.js:95:17)
at Pipe.close (net.js:466:12)

I suppose it's because I am missing some cordova utils. What do I need to install?

@niiamon

This comment has been minimized.

Copy link

commented Feb 25, 2014

I got this fixed by running:

npm install cordova in the root of my project folder.

However I still have other problems when I run cordova build ios:

throw new Error('Platform and density not supported: ' + platform + ', ' +

I'm at a loss what this means. It appears the script expect the ios icons to have density information in the tags in the config.xml. Not too sure what that means.

@niiamon

This comment has been minimized.

Copy link

commented Feb 25, 2014

I fixed this. I had copied and pasted some directives into the config.xml from some other place and that was messing things up. But now splash screens do not work at all. I don't see the script trying to copy it.

@niiamon

This comment has been minimized.

Copy link

commented Feb 25, 2014

I finally fixed my problem. It appears that the script is looking for a gap:splash tag within config.xml as the following lines from icons_and_splash.js shows:

projectConfig.doc.findall('*').filter(function (node) {
return (node.tag == 'gap:splash');
}).map(function (node) {
copyAsset ('splash', node);
});

However, @LinusU recommended that we have this in the config.xml:

<gap:platform gap:platform="ios" src="res/splash/ios/screen-iphone-portrait.png" />

Obviously the script would fail to find the splash because there's a mismatch between what it expects the tag to be and what the tag actually is.

The simple solution I used was to instead use this tag within the config.xml file:

<gap:splash gap:platform="ios" src="res/splash/ios/screen-ipad-portrait.png" />

Combining that with the properly named files, I was able to get splash screens also working correctly.

@antoineF

This comment has been minimized.

Copy link

commented Feb 26, 2014

convert.sh for Mac :

#
# (OS X)
#
# What is this?
#
# It's a shell script that is using sips to create all the icon files from one source icon.
#
# Stick the script in your 'www/res/icons' folder with your source icon 'my-hires-icon.png' then trigger it from Terminal.
#

ICON=${1:-"my-hires-icon.png"}

mkdir android
sips $ICON -Z 36 -o android/icon-36-ldpi.png
sips $ICON -Z 48 -o android/icon-48-mdpi.png
sips $ICON -Z 72 -o android/icon-72-hdpi.png
sips $ICON -Z 96 -o android/icon-96-xhdpi.png

mkdir ios
sips $ICON -Z 29 -o ios/icon-29.png
sips $ICON -Z 40 -o ios/icon-40.png 
sips $ICON -Z 50 -o ios/icon-50.png 
sips $ICON -Z 57 -o ios/icon-57.png
sips $ICON -Z 58 -o ios/icon-29-2x.png
sips $ICON -Z 60 -o ios/icon-60.png
sips $ICON -Z 72 -o ios/icon-72.png
sips $ICON -Z 76 -o ios/icon-76.png  
sips $ICON -Z 80 -o ios/icon-40-2x.png
sips $ICON -Z 100 -o ios/icon-50-2x.png
sips $ICON -Z 114 -o ios/icon-57-2x.png     
sips $ICON -Z 120 -o ios/icon-60-2x.png
sips $ICON -Z 144 -o ios/icon-72-2x.png
sips $ICON -Z 152 -o ios/icon-76-2x.png
@klikin

This comment has been minimized.

Copy link

commented Mar 1, 2014

Hi:

Got an error :(

$ cordova run android
Generating config.xml from defaults for platform "android"
Preparing android project

/usr/local/lib/node_modules/cordova/node_modules/q/q.js:126
throw e;
^
Error: Script "/project/.cordova/hooks/after_prepare/icons_and_splash.js" exited with status code 8. Aborting. Output:

/project/.cordova/hooks/after_prepare/icons_and_splash.js:6
var projectConfig = new cordova_util.config_parser(projectXml);
^
TypeError: undefined is not a function
at Object. (/project/.cordova/hooks/after_prepare/icons_and_splash.js:6:21)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Function.Module.runMain (module.js:497:10)
at startup (node.js:119:16)
at node.js:901:3

at /usr/local/lib/node_modules/cordova/src/hooker.js:138:34
at ChildProcess.exithandler (child_process.js:641:7)
at ChildProcess.EventEmitter.emit (events.js:98:17)
at maybeClose (child_process.js:735:16)
at Socket.<anonymous> (child_process.js:948:11)
at Socket.EventEmitter.emit (events.js:95:17)
at Pipe.close (net.js:466:12)
@jernejcic

This comment has been minimized.

Copy link

commented Mar 11, 2014

@klikin, did you figure this out? I'm getting the same thing but on Windows. It runs fine on my Mac though.

@slawo

This comment has been minimized.

Copy link

commented Mar 20, 2014

config_parser has been removed in this commit: apache/cordova-cli@45e80ac#diff-34a6d62af0cf0b784f8444529f3130ef

replace

var projectConfig = new cordova_util.config_parser(projectXml);

with

var ConfigParser = cordova_util.config_parser
if(undefined === ConfigParser) {
    ConfigParser = require('cordova/src/ConfigParser');
}
var projectConfig = new ConfigParser(projectXml);
@hartman

This comment has been minimized.

Copy link

commented Mar 26, 2014

i've made some changes in my version: https://gist.github.com/hartman/9784684

it includes slawo's change, but also supports the older method
has winphone support
warns about missing icons
warns when no icons are not defined in config.xml

@niiamon

This comment has been minimized.

Copy link

commented Apr 2, 2014

@hartman I get some breaking errors although the copy action for icons works well:

Update all icons for project: MyProject

copying from res/icons/android/icon-36-ldpi.png to the platforms/android/res/drawable-ldpi/icon.png

copying from res/icons/android/icon-48-mdpi.png to the platforms/android/res/drawable-mdpi/icon.png

copying from res/icons/android/icon-72-hdpi.png to the platforms/android/res/drawable-hdpi/icon.png

copying from res/icons/android/icon-96-xhdpi.png to the platforms/android/res/drawable-xhdpi/icon.png

copying from res/icons/ios/icon-29.png to the platforms/ios/MyProject/Resources/icons/icon-small.png

copying from res/icons/ios/icon-29-2x.png to the platforms/ios/MyProject/Resources/icons/icon-small@2x.png

copying from res/icons/ios/icon-40.png to the platforms/ios/MyProject/Resources/icons/icon-40.png

copying from res/icons/ios/icon-40-2x.png to the platforms/ios/MyProject/Resources/icons/icon-40@2x.png

copying from res/icons/ios/icon-50.png to the platforms/ios/MyProject/Resources/icons/icon-50.png

copying from res/icons/ios/icon-50-2x.png to the platforms/ios/MyProject/Resources/icons/icon-50@2x.png

copying from res/icons/ios/icon-57.png to the platforms/ios/MyProject/Resources/icons/icon.png

copying from res/icons/ios/icon-57-2x.png to the platforms/ios/MyProject/Resources/icons/icon@2x.png

copying from res/icons/ios/icon-60.png to the platforms/ios/MyProject/Resources/icons/icon-60.png

copying from res/icons/ios/icon-60-2x.png to the platforms/ios/MyProject/Resources/icons/icon-60@2x.png

copying from res/icons/ios/icon-72.png to the platforms/ios/MyProject/Resources/icons/icon-72.png

copying from res/icons/ios/icon-72-2x.png to the platforms/ios/MyProject/Resources/icons/icon-72@2x.png

copying from res/icons/ios/icon-76.png to the platforms/ios/MyProject/Resources/icons/icon-76.png

copying from res/icons/ios/icon-76-2x.png to the platforms/ios/MyProject/Resources/icons/icon-76@2x.png

/path/to/.cordova/hooks/after_prepare/icons_and_splash.js:136
throw err;
^
Error: ENOENT, stat 'res/icons/android/icon-36-ldpi.png'
Hook failed with error code 8: /path/to/.cordova/hooks/after_prepare/icons_and_splash.js

I am trying to figure out why this happens. The files are copied successfully and I can confirm that by looking at the icons in the platform folders. They are what you would expect.

The only way I have gotten it to work properly is to change all the throws to console.log to enable to code to fail silently. Any way to fix this?

@rsuper

This comment has been minimized.

Copy link

commented Apr 23, 2014

@niiamon The script can't find the file, so it throws that error.
To make it work, I added these 2 lines on line 132 and 133:

srcPath = projectRoot + '/www/' + srcPath;
dstPath = projectRoot + '/' + dstPath;

Just above - console.log ('copying from '+srcPath+' to the '+dstPath); - where it outputs which file is being copied.
Note: I used the version of @hartman

@Takeno

This comment has been minimized.

Copy link

commented May 1, 2014

@hartman @rsuper @niiamon
The best way to fix relative path issue in the script is:

  1. Include path module after line 10 var path = require('path'); (after fs declaration)
  2. Fix srcPath in line 98 var srcPath = path.join(projectRoot, 'www', node.attrib.src);
  3. Fix dstPath in line 106 var dstPath = path.join(projectRoot, 'platforms', platform, assetDir, fileName);
@AncAinu

This comment has been minimized.

Copy link

commented May 6, 2014

I forked this gist and fixed issues I found: https://gist.github.com/AncAinu/40b7d85d3c6ed77150aa

@manuganji

This comment has been minimized.

Copy link

commented May 8, 2014

For ubuntu, instead of mkdir android you can use mkdir -p android to suppress the annoying message when the directory is already present.

@shedd

This comment has been minimized.

Copy link

commented Jun 8, 2014

I ran into some issues with Cordova 3.5.0.

Cordova was refactored in this commit: apache/cordova-cli@b51e1c1

Therefore, some changes are required to get this to run under the latest version.

First, in addition to having cordova installed at the root of your project, also install:

npm install cordova-lib

Then, change:

var cordova_util = require('cordova/src/util');

to

var cordova_util = require('cordova-lib/src/cordova/util');

Also, make this change - https://gist.github.com/LinusU/7515016#comment-1195042 - for ConfigParser.

Then change:

ConfigParser = require('cordova/src/ConfigParser');

to

ConfigParser = require('cordova-lib/src/cordova/ConfigParser');
@shedd

This comment has been minimized.

Copy link

commented Jun 8, 2014

I've forked the gist and included the updates from @hartman and @Takeno plus the revisions needed for Cordova 3.5.0.

Updated version here: https://gist.github.com/shedd/2bcbecec53ee8cddebfe

@shedd

This comment has been minimized.

Copy link

commented Jun 8, 2014

If anyone is looking for a conversion script that handles splash screens, I found this option: https://github.com/tlvince/phonegap-icon-splash-generator

I ended up taking bits and pieces of the two scripts and hooking them both into my build process.

@MGalv

This comment has been minimized.

Copy link

commented Sep 2, 2014

For cordoba-lib version ~> 0.21.4, you should change this line:

CordovaConfigParser = require('cordova-lib/src/cordova/configparser');

for this one:

CordovaConfigParser = require('cordova-lib').configparser;
@sirdavid32

This comment has been minimized.

Copy link

commented Oct 27, 2015

It´s been 2 days now, please help me solve this error, please:
On my cmd I type:

D:\VB4>phonegap build android

Then it returns:
[phonegap] executing 'cordova build android'...
D:\VB4\res\icons\ is a directory (not copied)

Running command: "C:\Program Files\nodejs\node.exe" D:\VB4\hooks\after_prepare\i
cons_and_splash.js D:\VB4

module.js:338
throw err;
^

Error: Cannot find module 'cordova/src/util'
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:286:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at Object. (D:\VB4\hooks\after_prepare\icons_and_splash.js:3:20)
at Module._compile (module.js:434:26)
at Object.Module._extensions..js (module.js:452:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
at Function.Module.runMain (module.js:475:10)

Error: Hook failed with error code 1: D:\VB4\hooks\after_prepare\icons_and_splas
h.js

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.