dyld: lazy symbol binding failed: Symbol not found: __ZN4node19GetCurrentEventLoopEPN2v87IsolateE
Referenced from: /usr/local/lib/node_modules/cordova-res/node_modules/sharp/build/Release/sharp.node
Expected in: flat namespace

dyld: Symbol not found: __ZN4node19GetCurrentEventLoopEPN2v87IsolateE
Referenced from: /usr/local/lib/node_modules/cordova-res/node_modules/sharp/build/Release/sharp.node
Expected in: flat namespace

We should provide feedback for invalid source images.

For example, the icons must be 1024x1024 and the splashes must be 2732x2732. Both must be PNG files.

Running the command cordova-res android --type splash gives this ouput:
Generated 12 resources for android
Wrote to config.xml

12 files are generated (6 for portrait, 6 for landscape) but it's adding only six entries in the config.xml pointing only to the portrait generated files:

<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />

The references to landscape generated files are not added to the config.xml

I'm using version 0.6.0

Cordova CLI: 9.0.0 ([email protected])
Cordova Platforms : android 8.1.0
cordova-res : 0.8.1
npm : 6.12.0

In Android guidelines
(https://developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive) you can read, that both layers must be sized at 108 x 108 dp. If I take the icon-foreground.png and icon-background.png with this resolution no adaptive icons will be generated in folder 'resources/android/icon'.

I used cordova-res v0.6.0 to generate adaptive icons. I have an icon.png in /resources and an icon-foreground.png and an icon-background.png in /resources/android.

I create the icons with cordova-res without any parameters. After it is run there are a lot of generated icons in /resources/android/icon:
*-background.png
*-foreground.png
drawable-*-icon.png

And these icons are correctly referenced in config.xml. But when I build my app and install it on my Google Pixel 3 phone (Andorid 9) it still has such a small launcher icon.

Are there any special requirements for icon-foreground.png and icon-background.png for getting a launcher icon that fills the whole icon?

• ionic-team/ionic-cli#2679
• #38

Somehow consolidate Android (landscape/portrait) and iOS (multi-image launch storyboard) which are sort of the same idea.

This tool should have an option to write generated resources directly to native iOS and Android projects as assets.

• ionic-team/capacitor#229
• https://www.joshmorony.com/adding-icons-splash-screens-launch-images-to-capacitor-projects/

Cordova CLI: 9.0.0 ([email protected])
Cordova Platforms : android 8.1.0
cordova-res : 0.8.1
npm : 6.12.0

If I only put icon-foreground.png in folder resources/android/ and than call
cordova-res android --icon-background-source #FF0000
following error is thrown:
ERROR: Missing source for "adaptive-icon" (sources: resources/android/icon-background.png, resources/android/icon-background.jpg, resources/android/icon-background.jpeg)
and only 6 xxx-foreground.png where generated.

Can't install with this log:

/usr/local/bin/cordova-res -> /usr/local/lib/node_modules/cordova-res/bin/cordova-res

> [email protected] install /usr/local/lib/node_modules/cordova-res/node_modules/sharp
> (node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)

info sharp Downloading https://github.com/lovell/sharp-libvips/releases/download/v8.7.4/libvips-8.7.4-darwin-x64.tar.gz
ERR! sharp EACCES: permission denied, open '/usr/local/lib/node_modules/cordova-res/node_modules/sharp/16245-libvips-8.7.4-darwin-x64.tar.gz'
info sharp Attempting to build from source via node-gyp but this may fail due to the above error
info sharp Please see https://sharp.pixelplumbing.com/page/install for required dependencies
gyp WARN EACCES user "root" does not have permission to access the dev dir "/Users/mauro/.node-gyp/10.16.0"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/usr/local/lib/node_modules/cordova-res/node_modules/sharp/.node-gyp"
gyp WARN install got an error, rolling back install
gyp WARN install got an error, rolling back install
gyp ERR! configure error 
gyp ERR! stack Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/cordova-res/node_modules/sharp/.node-gyp'
gyp ERR! System Darwin 18.6.0
gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /usr/local/lib/node_modules/cordova-res/node_modules/sharp
gyp ERR! node -v v10.16.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok 
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: `(node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/mauro/.npm/_logs/2019-06-25T14_34_41_300Z-debug.log

Some help ?

For some app we need to apply 9 Patch as it's basic form (just 1px of background on the sides of the image) to the Android splashscreens. There are some tools out there that could be cli-chained with cordova-res but it could be awesome to have it as an option (also to automatically rename config.xml references).

Hi,

In a new cordova project (cordova create) I used cordova-res with default options. Then I built android and ios apps. Looking into platform specific source, I see some icons and splash screens missing.

-IOS splash
in folder platforms/ios/HelloCordova/Images.xcassets
The following splash are the cordova default. They should be repleaced by generated ones
Default-2436h.png
Default-Landscape-2436h.png

-iOS icons
in folder platforms/ios/HelloCordova/AppIcon.appiconset
The following icons are the cordova default. They should be repleaced by generated ones

icon-20.png
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]

-Android in folder platforms/android/app/src/main/res
Some subfolders are empty, or contain only splash or only icon. But I guess this is normal. Isn't it?

I've spent some time figuring this one out, and I managed only thanks to your great unit tests :)
but the --help documentation doesn't help much with generating adaptive icons.

Recommendation:

• add adaptive-icon to the --type <icon|splash> list
• it was not clear that I can also use this option without any extra flag, I thought --icon-foreground-source and --icon-background-source are required params here. Adding some extra info about adaptive icons in the "Without specifying options..." block could help.
• subjective: I think the command usage and documentation could be much simpler if it always assumed the default file names being used (icon.png, splash.png, icon-foreground.png and icon-background.png), because now it leaves a lot more room for errors, and using different file names is not adding any benefits to it in my opinion.

When running cordova-res multiple times with different --resources parameters, multiple icon and splash configurations will be added to config.xml.
I would expect, that the existing information will be updated/replaced with new path.
It's working fine for android.

example for cordova-res --resources res/dev && cordova-res --resources res/cons:

<platform name="ios">
        <icon height="57" src="res/dev/ios/icon/icon.png" width="57" />
        <icon height="114" src="res/dev/ios/icon/[email protected]" width="114" />
        <icon height="20" src="res/dev/ios/icon/icon-20.png" width="20" />
        <icon height="40" src="res/dev/ios/icon/[email protected]" width="40" />
        <icon height="60" src="res/dev/ios/icon/[email protected]" width="60" />
        <icon height="29" src="res/dev/ios/icon/icon-29.png" width="29" />
        <icon height="58" src="res/dev/ios/icon/[email protected]" width="58" />
        <icon height="87" src="res/dev/ios/icon/[email protected]" width="87" />
        <icon height="48" src="res/dev/ios/icon/[email protected]" width="48" />
        <icon height="55" src="res/dev/ios/icon/[email protected]" width="55" />
        <icon height="88" src="res/dev/ios/icon/[email protected]" width="88" />
        <icon height="172" src="res/dev/ios/icon/[email protected]" width="172" />
        <icon height="196" src="res/dev/ios/icon/[email protected]" width="196" />
        <icon height="216" src="res/dev/ios/icon/[email protected]" width="216" />
        <icon height="40" src="res/dev/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="res/dev/ios/icon/[email protected]" width="80" />
        <icon height="120" src="res/dev/ios/icon/[email protected]" width="120" />
        <icon height="50" src="res/dev/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="res/dev/ios/icon/[email protected]" width="100" />
        <icon height="60" src="res/dev/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="res/dev/ios/icon/[email protected]" width="120" />
        <icon height="180" src="res/dev/ios/icon/[email protected]" width="180" />
        <icon height="72" src="res/dev/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="res/dev/ios/icon/[email protected]" width="144" />
        <icon height="76" src="res/dev/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="res/dev/ios/icon/[email protected]" width="152" />
        <icon height="167" src="res/dev/ios/icon/[email protected]" width="167" />
        <icon height="29" src="res/dev/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="res/dev/ios/icon/[email protected]" width="58" />
        <icon height="87" src="res/dev/ios/icon/[email protected]" width="87" />
        <icon height="1024" src="res/dev/ios/icon/icon-1024.png" width="1024" />
        <splash height="1136" src="res/dev/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="res/dev/ios/splash/Default-667h.png" width="750" />
        <splash height="2688" src="res/dev/ios/splash/Default-2688h~iphone.png" width="1242" />
        <splash height="1242" src="res/dev/ios/splash/Default-Landscape-2688h~iphone.png" width="2688" />
        <splash height="1792" src="res/dev/ios/splash/Default-1792h~iphone.png" width="828" />
        <splash height="828" src="res/dev/ios/splash/Default-Landscape-1792h~iphone.png" width="1792" />
        <splash height="2436" src="res/dev/ios/splash/Default-2436h.png" width="1125" />
        <splash height="1125" src="res/dev/ios/splash/Default-Landscape-2436h.png" width="2436" />
        <splash height="2208" src="res/dev/ios/splash/Default-736h.png" width="1242" />
        <splash height="1242" src="res/dev/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" src="res/dev/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2048" src="res/dev/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="768" src="res/dev/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" src="res/dev/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="2732" src="res/dev/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="1024" src="res/dev/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="960" src="res/dev/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="480" src="res/dev/ios/splash/Default~iphone.png" width="320" />
        <splash height="2732" src="res/dev/ios/splash/Default@2x~universal~anyany.png" width="2732" />
        <icon height="57" src="res/cons/ios/icon/icon.png" width="57" />
        <icon height="114" src="res/cons/ios/icon/[email protected]" width="114" />
        <icon height="20" src="res/cons/ios/icon/icon-20.png" width="20" />
        <icon height="40" src="res/cons/ios/icon/[email protected]" width="40" />
        <icon height="60" src="res/cons/ios/icon/[email protected]" width="60" />
        <icon height="29" src="res/cons/ios/icon/icon-29.png" width="29" />
        <icon height="58" src="res/cons/ios/icon/[email protected]" width="58" />
        <icon height="87" src="res/cons/ios/icon/[email protected]" width="87" />
        <icon height="48" src="res/cons/ios/icon/[email protected]" width="48" />
        <icon height="55" src="res/cons/ios/icon/[email protected]" width="55" />
        <icon height="88" src="res/cons/ios/icon/[email protected]" width="88" />
        <icon height="172" src="res/cons/ios/icon/[email protected]" width="172" />
        <icon height="196" src="res/cons/ios/icon/[email protected]" width="196" />
        <icon height="216" src="res/cons/ios/icon/[email protected]" width="216" />
        <icon height="40" src="res/cons/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="res/cons/ios/icon/[email protected]" width="80" />
        <icon height="120" src="res/cons/ios/icon/[email protected]" width="120" />
        <icon height="50" src="res/cons/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="res/cons/ios/icon/[email protected]" width="100" />
        <icon height="60" src="res/cons/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="res/cons/ios/icon/[email protected]" width="120" />
        <icon height="180" src="res/cons/ios/icon/[email protected]" width="180" />
        <icon height="72" src="res/cons/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="res/cons/ios/icon/[email protected]" width="144" />
        <icon height="76" src="res/cons/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="res/cons/ios/icon/[email protected]" width="152" />
        <icon height="167" src="res/cons/ios/icon/[email protected]" width="167" />
        <icon height="29" src="res/cons/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="res/cons/ios/icon/[email protected]" width="58" />
        <icon height="87" src="res/cons/ios/icon/[email protected]" width="87" />
        <icon height="1024" src="res/cons/ios/icon/icon-1024.png" width="1024" />
        <splash height="1136" src="res/cons/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="res/cons/ios/splash/Default-667h.png" width="750" />
        <splash height="2688" src="res/cons/ios/splash/Default-2688h~iphone.png" width="1242" />
        <splash height="1242" src="res/cons/ios/splash/Default-Landscape-2688h~iphone.png" width="2688" />
        <splash height="1792" src="res/cons/ios/splash/Default-1792h~iphone.png" width="828" />
        <splash height="828" src="res/cons/ios/splash/Default-Landscape-1792h~iphone.png" width="1792" />
        <splash height="2436" src="res/cons/ios/splash/Default-2436h.png" width="1125" />
        <splash height="1125" src="res/cons/ios/splash/Default-Landscape-2436h.png" width="2436" />
        <splash height="2208" src="res/cons/ios/splash/Default-736h.png" width="1242" />
        <splash height="1242" src="res/cons/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" src="res/cons/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2048" src="res/cons/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="768" src="res/cons/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" src="res/cons/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="2732" src="res/cons/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="1024" src="res/cons/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="960" src="res/cons/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="480" src="res/cons/ios/splash/Default~iphone.png" width="320" />
        <splash height="2732" src="res/cons/ios/splash/Default@2x~universal~anyany.png" width="2732" />
    </platform>

E:\work\pro-isip\ISIPAppV2>npm install cordova-res
npm WARN deprecated [email protected]: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)
D:\work\003node\cordova-res -> D:\work\003node\node_modules\cordova-res\bin\cordova-res

[email protected] install D:\work\003node\node_modules\cordova-res\node_modules\sharp
(node install/libvips && node install/dll-copy && prebuild-install --runtime=napi) || (node-gyp rebuild && node install/dll-copy)

info sharp Downloading https://github.com/lovell/sharp-libvips/releases/download/v8.9.1/libvips-8.9.1-win32-x64.tar.gz
ERR! sharp getaddrinfo ENOENT github-production-release-asset-2e65be.s3.amazonaws.com github-production-release-asset-2e65be.s3.amazonaws.com:443
info sharp Attempting to build from source via node-gyp but this may fail due to the above error
info sharp Please see https://sharp.pixelplumbing.com/install for required dependencies

D:\work\003node\node_modules\cordova-res\node_modules\sharp>if not defined npm_config_node_gyp (node "D:\work\003node\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\....\nod
e_modules\node-gyp\bin\node-gyp.js" rebuild ) else (node "node D:\work\003node\node_modules\node-gyp\bin\node-gyp.js" rebuild )
internal/modules/cjs/loader.js:638
throw err;
^

Error: Cannot find module 'D:\work\003node\node_modules\cordova-res\node_modules\sharp\node D:\work\003node\node_modules\node-gyp\bin\node-gyp.js'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
at Function.Module._load (internal/modules/cjs/loader.js:562:25)
at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: (node install/libvips && node install/dll-copy && prebuild-install --runtime=napi) || (node-gyp rebuild && node install/dll-copy)
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Passwhl\AppData\Roaming\npm-cache_logs\2020-04-02T01_44_10_912Z-debug.log

The version 0.7.0 introduced a bug that don't permit generate iOS or Android resources if browser platform is added to project.

See below with 0.7.0 and the 0.6.0 versions:

ludufre@MacBook-Pro-de-Luan sonar % npm i -g cordova-res@latest        
/Users/ludufre/.npm-packages/bin/cordova-res -> /Users/ludufre/.npm-packages/lib/node_modules/cordova-res/bin/cordova-res
+ [email protected]
updated 1 package in 2.901s
ludufre@MacBook-Pro-de-Luan sonar % ionic cordova resources ios --force
> cordova-res ios
[cordova-res] ERROR: Unsupported platform: browser
[ERROR] An error occurred while running subprocess cordova-res.
        
        cordova-res ios exited with exit code 1.
        
        Re-running this command with the --verbose flag may provide more information.
ludufre@MacBook-Pro-de-Luan sonar % 
ludufre@MacBook-Pro-de-Luan sonar % 
ludufre@MacBook-Pro-de-Luan sonar % 
ludufre@MacBook-Pro-de-Luan sonar % 
ludufre@MacBook-Pro-de-Luan sonar % npm i -g [email protected]         
/Users/ludufre/.npm-packages/bin/cordova-res -> /Users/ludufre/.npm-packages/lib/node_modules/cordova-res/bin/cordova-res
+ [email protected]
updated 1 package in 3.232s
ludufre@MacBook-Pro-de-Luan sonar % ionic cordova resources ios --force
> cordova-res ios
[cordova-res] Generated 45 resources for ios
[cordova-res] Wrote to config.xml
ludufre@MacBook-Pro-de-Luan sonar %

P.S.: I didn't found an issue template.

Hello,

I'm using the build in version in ionic (v0.6.0) and missing the Launch Screens for the new iPhone X.
Source of Screensizes was https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/launch-screen/

Regards
Marc

This does not appear to generate an icon for Electron apps

ERROR: Missing source image for "icon" (sources: resources/android/icon.png, resources/android/icon.jpg, resources/android/icon.jpeg, resources/icon.png, resources/icon.jpg, resources/icon.jpeg)

Simply running cordova-res gives me that output....
I'm running on the project root and I have the resources/icon.png file...
So, am I missing something really obvious or its there really a bug?

Also tried: cordova-res --type=icon --icon-source=resources/icon.png and same error

The source image requirements are currently the smallest possible resolutions to account for every platform. But, if cordova-res is generating only for one platform, we can loosen the requirements to that platform.

For example, iOS requires a 1024x1024 source image for icons because that's the largest icon generated (the App Store icon), but Android only requires 512x512. So, when running cordova-res android --type icon, we can accept 512x512 source images.

ref: #18 (comment)

Type: bug report

When running cordova-res I get the following error:
RangeError: Maximum call stack size exceeded at Object.inspect (util.js:293:15) at ValidationError.toString (/Users/mike/.nvm/versions/node/v10.5.0/lib/node_modules/cordova-res/dist/error.js:13:58) at ValidationError.inspect (/Users/mike/.nvm/versions/node/v10.5.0/lib/node_modules/cordova-res/dist/error.js:16:21) at ValidationError.deprecated (internal/util.js:70:15) at formatValue (util.js:467:31) at Object.inspect (util.js:328:10) at ValidationError.toString (/Users/mike/.nvm/versions/node/v10.5.0/lib/node_modules/cordova-res/dist/error.js:13:58) at ValidationError.inspect (/Users/mike/.nvm/versions/node/v10.5.0/lib/node_modules/cordova-res/dist/error.js:16:21) at ValidationError.deprecated (internal/util.js:70:15) at formatValue (util.js:467:31)(node:76525) [DEP0079] DeprecationWarning: Custom inspection function on Objects via .inspect() is deprecated
The issue is the same when using the flags to only generate icons or only generate splash screens

I generated 6 adaptive icons with cordova-res android --type adaptive-icon, and they were added to config.xml, too, but after that ionic cordova run android started to fail with the below error:

Path must be a string. Received undefined
TypeError: Path must be a string. Received undefined
    at assertPath (path.js:28:11)
    at Object.basename (path.js:820:5)
    at updateIcons (C:\my-app\platforms\android\cordova\lib\prepare.js:376:71)
    at C:\my-app\platforms\android\cordova\lib\prepare.js:49:9
    at _fulfilled (C:\my-app\platforms\android\cordova\node_modules\q\q.js:834:54)
    at self.promiseDispatch.done (C:\my-app\platforms\android\cordova\node_modules\q\q.js:863:30)
    at Promise.promise.promiseDispatch (C:\my-app\platforms\android\cordova\node_modules\q\q.js:796:13)
    at C:\my-app\platforms\android\cordova\node_modules\q\q.js:604:44
    at runSingle (C:\my-app\platforms\android\cordova\node_modules\q\q.js:137:13)
    at flush (C:\my-app\platforms\android\cordova\node_modules\q\q.js:125:13)

Great work on the plugin.

Just an idea, would be good to be able to parallelize the image generation step, as I notice that it takes longer than it really needs to on a 6-core MacBook Pro.

thoughts?

if I set logstream: null, then I have an error:

[Cannot read property 'write' of null]

How can I disable debug logs?

my config:

    cres.run({
        platforms: {
            android: {icon: {sources: [iconPath]}, splash: {sources: [splashScreenPath]}},
            ios: {icon: {sources: [iconPath]}, splash: {sources: [splashScreenPath]}},
        },
        logstream: null, // Any WritableStream
        errstream: process.stderr, // Any WritableStream
        resourcesDirectory: outputDir,
        directory: outputDir
    })
        .then((response) => {
            spinner.stop();
            console.log(' ' + '✓'.green + ' Done!');
        })
        .catch((error) => {
            spinner.stop();
            console.error(`[${error.message}] error:`, error);
            process.exit(1);
        });

When I add the iOS platform in my project, not all icons required are generated. From a clean project, I see the following when inspecting images.xcassets in Xcode 10.2 after cordova-res has been run

As you can see, the following sizes are missing;

Apple Watch Home Screen 44pt@2x
Apple Watch Home Screen 50pt@2x
Apple Watch Short Look 108pt@2x

and there is an unassigned image

[email protected]

The code which gets added to my config.xml is as follows;

        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/[email protected]" width="114" />
        <icon height="20" src="resources/ios/icon/icon-20.png" width="20" />
        <icon height="40" src="resources/ios/icon/[email protected]" width="40" />
        <icon height="60" src="resources/ios/icon/[email protected]" width="60" />
        <icon height="29" src="resources/ios/icon/icon-29.png" width="29" />
        <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
        <icon height="87" src="resources/ios/icon/[email protected]" width="87" />
        <icon height="48" src="resources/ios/icon/[email protected]" width="48" />
        <icon height="55" src="resources/ios/icon/[email protected]" width="55" />
        <icon height="88" src="resources/ios/icon/[email protected]" width="88" />
        <icon height="172" src="resources/ios/icon/[email protected]" width="172" />
        <icon height="196" src="resources/ios/icon/[email protected]" width="196" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/[email protected]" width="80" />
        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/[email protected]" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/[email protected]" width="120" />
        <icon height="180" src="resources/ios/icon/[email protected]" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/[email protected]" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/[email protected]" width="152" />
        <icon height="167" src="resources/ios/icon/[email protected]" width="167" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/[email protected]" width="58" />
        <icon height="87" src="resources/ios/icon/[email protected]" width="87" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />

What are we doing wrong, and is there a way to add the alternative sizes in ourselves via config.xml?

Ionic:

   Ionic CLI          : 5.3.0 (/Users/Brian/.nvm/versions/node/v11.7.0/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.4

Cordova:

   Cordova CLI       : 8.1.2 ([email protected])
   Cordova Platforms : ios 4.5.5
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, (and 16 other plugins)

Utility:

   cordova-res : 0.6.0 
   native-run  : 0.2.8 

System:

   Android SDK Tools : 26.1.1 (/Users/Brian/Library/Android/sdk)
   ios-deploy        : 1.9.4
   NodeJS            : v11.7.0 (/Users/brian/.nvm/versions/node/v11.7.0/bin/node)
   npm               : 6.5.0
   OS                : macOS Mojave
   Xcode             : Xcode 10.2.1 Build version 10E1001

We can warn the dev when their icon does not meet certain criteria in the Human Interface Guidelines. We can detect certain things programmatically, such as transparency and in-raster rounded corners.

Feature Request

Describe the Feature Request
Generate icons for PWA and copy the generated icons into the appropriate PWA folder. If possible update the manifest, too.

Describe Alternatives

• Mobicon: https://github.com/SamVerschueren/mobicon
• Web App Manifest Generator: https://app-manifest.firebaseapp.com/

Related Code

$ cordova-res pwa
$ cordova-res pwa --skip-config --copy

Additional Context

• Set of recommended icon size:

icon-72x72
icon-96x96
icon-120x120
icon-128x128
icon-144x144
icon-152x152
icon-180x180
icon-192x192
icon-384x384
icon-512x512

• W3C Web App Manifest: https://www.w3.org/TR/appmanifest/

In cordova 8 support for adaptive icons where (finally) added. See documentation and the related pull-request for details.

Be aware of foreground and background do not need to be an png. The documentation mention all possible configurations.

The question is only how to mark foreground and background images in the resource folder.

1. You can add a convention e.g.: icon-foreground.png and icon-background.png
2. Or you can add parameters to specify this icons or the background color.

Can you add SVG as a source? e.g. icon.svg and splash.svg?

anyone has problem with this?

https://github.com/ionic-team/cordova-res/blob/6be85a97fc4e312d8a124a0433da24f09a7b0552/src/config.ts#L19

When generate resources in iOS target only project, cordova-res will create <platform name="android" /> node at first time run. Then if you rerun, it will generate android resources and insert to config.xml.

With the support of Capacitor via #85, and the upcoming support of PWAs (#95), it's clear the name of this package no longer encompasses its scope.

The package should be renamed before the 1.0.0 release.

• @ionic/res (ionic-res binary)
• @ionic/resources (ionic-resources binary)
• ionic-res
• ion-res
• ... others?

PNG quality defaults to 100, which might result in larger images than expected. Perhaps a --quality option is necessary to fine tune this. Also, setting the default quality to something more reasonable might be in order.

ref: #4

We just ran into a scenario where our source icon.png had an alpha channel. We generate app icons:

ionic cordova resources ios -i

And all the resulting icon images had alpha as well. This caused an issue when uploading the final iOS build to Apple:

ITMS-90717: "Invalid App Store Icon. The App Store Icon in the asset catalog in 'xxx.app' can't be transparent nor contain an alpha channel.

We were able to workaround the issue by resaving the source icon image without alpha, but since it is clear that that Apple won't accept images with alpha, it'd be nice if cordova-res took care of that automatically.

Thanks!

Would be great if I could require it and pass it path arguments instead of having to call it via the cli

Could you please consider adding support for generating more than icon and splash resources?

As far as I know, right now, the only way to add an icon for the native parts of the app is to manually resize/convert it and to add it's each generated resource via tag to the config.xml

When generating images for Android the cordova-res tool also registers the generated images in config.xml however it registers them for portrait and landscape orientation only. When creating a production build (using ionic cordova build android --release --prod) for android, android lint checks errors will be thrown because no defaults (In this case, without port- or land- ) as a fallback is provided. The errors are as below

/Users/alexryltsov/Git/BOSS811/master/platforms/android/app/src/main/res/drawable-port-xxhdpi/screen.png: Error: The drawable "screen" in drawable-port-xxhdpi has no declaration in the base drawable folder or in a drawable-densitydpi folder; this can lead to crashes when the drawable is queried in a configuration that does not match this qualifier [MissingDefaultResource]
/Users/alexryltsov/Git/BOSS811/master/platforms/android/app/src/main/res/drawable-port-xxxhdpi/screen.png: Error: The drawable "screen" in drawable-port-xxxhdpi has no declaration in the base drawable folder or in a drawable-densitydpi folder; this can lead to crashes when the drawable is queried in a configuration that does not match this qualifier [MissingDefaultResource]

   Explanation for issues of type "MissingDefaultResource":
   If a resource is only defined in folders with qualifiers like -land or -en,
   and there is no default declaration in the base folder (layout or values
   etc), then the app will crash if that resource is accessed on a device
   where the device is in a configuration missing the given qualifier.

   As a special case, drawables do not have to be specified in the base
   folder; if there is a match in a density folder (such as drawable-mdpi)
   that image will be used and scaled. Note however that if you  only specify
   a drawable in a folder like drawable-en-hdpi, the app will crash in
   non-English locales.

   There may be scenarios where you have a resource, such as a -fr drawable,
   which is only referenced from some other resource with the same qualifiers
   (such as a -fr style), which itself has safe fallbacks. However, this still
   makes it possible for somebody to accidentally reference the drawable and
   crash, so it is safer to create a default dummy fallback in the base
   folder. Alternatively, you can suppress the issue by adding
   tools:ignore="MissingDefaultResource" on the element.

   (This scenario frequently happens with string translations, where you might
   delete code and the corresponding resources, but forget to delete a
   translation. There is a dedicated issue id for that scenario, with the id
   ExtraTranslation.)

Not sure if this tool should add these default/fallback or provide details in README how to fix these errors. Right now, the user gets the errors during the build after images are generated/registered in config.xml

To fix the errors I manually added the below

        <splash density="ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
        <splash density="mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
        <splash density="hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
        <splash density="xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
        <splash density="xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
        <splash density="xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />

Please also see discussion here apache/cordova-plugin-splashscreen#228 and apache/cordova-android#689 and apache/cordova-plugin-splashscreen#185

I think, it will be better to use verbose optional parameter, to avoid wrong outputs in logs.

I use ora for async spinner, but cordova-res show parallel own logs... which, I think, not necessary for many cases or in case of generating on CI-servers.

⠋ Generate icons and splashscreens for [MyApp]...WARN: No config.xml file in directory. Skipping config.
⠙ Generate icons and splashscreens for [MyApp]...Generated 18 resources for android
⠴ Generate icons and splashscreens for [MyApp]...Generated 50 resources for ios

in this case it will be better to have this case:

1. --verbose was activated
   • show outputs as before
2. --verbose was deactivated
   • return only JSON in response in output-stream
   • throw error message or JSON with errors in error-stream with process.exit(1) code!!!

Currently cordova-res return always exit code === "0" with errors inside of normal output stream...

Current behavior:

Generating Android adaptive icons works very well on devices with Api 26+.

I created the following icons:

• resources/android/icon-foreground.png must be at least 432×432px
• resources/android/icon-background.png must be at least 432×432px

After running cordova-res the icons are correctly generated and added to the config.xml:

<icon background="resources/android/icon/ldpi-background.png" density="ldpi" foreground="resources/android/icon/ldpi-foreground.png" />
...

On devices before Api 26 the foreground image is used as fallback icon for Android devices that do not support the adaptive icons. The foreground image only contains the app logo without any background color.

Expected behavior:

The fallback icon can be overridden by setting the src attribute. https://cordova.apache.org/docs/en/dev/config_ref/images.html#adaptive-icon-with-images

I was able to override the fallback icon on devices that do not support the adaptive icons.
I added the src attribute manually and used the drawable-...-icon.png generate from resources/icon.png before generating the adaptive icons.

<icon background="resources/android/icon/ldpi-background.png" density="ldpi" foreground="resources/android/icon/ldpi-foreground.png" src="resources/android/icon/drawable-ldpi-icon.png"/>
...

However, if I rerun cordova-res the src attribute is overridden and I have to add it manually again.

Could there be an option to supply the following images:

• resources/icon.png or resources/android/icon.png must be at least 1024×1024px
• resources/android/icon-foreground.png must be at least 432×432px
• resources/android/icon-background.png must be at least 432×432px

This will generate the drawable-...-icon.png icons, the foreground and background icons for adaptive icons and adds the following config to config.xml:

<icon background="resources/android/icon/ldpi-background.png" density="ldpi" foreground="resources/android/icon/ldpi-foreground.png" src="resources/android/icon/drawable-ldpi-icon.png"/>
...

Hey folks! Thanx for contributing with a proper image resources tool!

I'm coming from a long use of the now outdated cordova-icon.

I'm noticing my app size increase from 6MB to 30MB when using cordova-res.

Please let me know if I can provide any further info.

Is it possible to add svg to VectorDrawable support in the future?

cordova ios 5.01

I tried with new version 0.8.1 but the settings icon is not correct:

I installed cordova-res but when I run "ionic info" displays "cordova-res: not installed"

➜ sudo npm install -g cordova-res
/usr/local/bin/cordova-res -> /usr/local/lib/node_modules/cordova-res/bin/cordova-res

• [email protected]
  updated 1 package in 3.379s

~
➜ ionic info
[WARN] You are not in an Ionic project directory. Project context may be missing.

Ionic:

Ionic CLI : 5.2.0

Utility:

cordova-res : not installed
native-run : 0.2.7

System:

NodeJS : v12.5.0
npm : 6.9.0
OS : macOS Mojave

ERR! sharp Windows x86 (32-bit) node.exe is not supported

when try to install using

npm install -g cordova-res

first of all thanks for the awesome utility 👍

as per iOS guidelines they prefer if launcher icon is having flat background so it can be clipped easily by launcher and avoid black edge overlays

but at same time android provides flexibility and they don't do any kind of clipping plus most applications use rounded corners

if possible it will be great to have configurable rounded corners 😄

Cordova CLI: 9.0.0 ([email protected])
Cordova Platforms : android 8.1.0
cordova-res : 0.8.1
npm : 6.12.0

When specifying --type icon option only the non-adaptive icons are generated.

When running with the --verbose flag the log shows the following:

cordova-res:platform Running android platform with options: { 'adaptive-icon': undefined,

& just for brevity, running w/out the --type icon option, adaptive icons are generated.

Hi!

I've just noticed npm is at version 0.3.0 but github releases page is at 0.2.0 seems tag 0.3.0 wasnt pushed....

Should be simple to fix. I would send a PR but not sure how to PR a tag......

I just tried this package for the first time, and incorporated it into my project as part of a script that automatically adds the current version number to the splash screen. Everything works well (thanks, programmatic API!), but then I noticed that the files generated by cordova-res are significantly larger than the files generated by the ionic cordova resources command.

For example, using a source splash.png file with a size of 415127 bytes, I get the following Android file sizes:

I'm assuming the Sharp package used by cordova-res has default PNG output settings that differ from the settings used by the ionic.io API ... but I don't know what the specific differences might be.

Perhaps the user could pass in an optional object with PNG options that gets passed along to Sharp before toBuffer() runs? I can try to create a pull request that incorporates that if it sounds helpful.

Ionic : v5.4.4
Cordova : v9.0.0
Node : node -> stable (-> v12.13.0)

Issue

I am creating adaptive icon for android project as of docs given in the cordova-res docs .

Adaptive icons working fine but for lower version devices like android v5 or v6 it is taking foreground image.
I have also tried to add new images of same dimentions in mipmap-xxx folders but when I create new build it getting removed and So it's taking foreground images only.

Expected behaviour

It should take adaptive icon for higher version (8 / 9) and legacy icon for older version devices.

There are multiple libraries attempting to simplify icon generation, based on an SVG template.

It would be neat if those projects could collaborate on an underlying lib, and then use that shared lib for various things (Cordova, React Native, CLI, etc).

By collaborating on a shared base you would free time for more sugar on top (specific to Cordova, React Native, etc). Plus, there is a steady stream of new icons etc, so supporting them requires a group effort.

Some repos that could benefit from collaboration:

https://github.com/quasarframework/app-extension-icon-genie
https://github.com/isleofcode/splicon
https://github.com/aeirola/react-native-svg-app-icon
https://github.com/SamVerschueren/mobicon-cli

Let me know what you think!

Ping!
@aeirola
@dwieeb
@alexblom
@SamVerschueren