Electron Packager - set App Icons for OSX & Windows

Question

I am building my electron application with electron packager for windows and OSX platform.

package.json:

"build": "electron-packager . $npm_package_productName --out=dist --ignore='^/dist$' --prune --all --icon=icon.icns"

I run my build process with npm run build.

Question:

How can I use the electron packager script in my package.json to set the windows AND osx Icon?

Problem:

The above script sets the app icon for OSX only.
It doesnt set the icon for the windows app (NPM throws failure).

Solution:

I had to install wine on my OSX. Otherwise it is not possible to build the windows exe with the --icon tag. Why? Because electron-packager uses node-rcedit for that, which requires wine.

in my package.json:

"pack:osx": "electron-packager . $npm_package_productName --out=dist/osx --platform=darwin --arch=x64 --icon=assets/build/osx/icon.icns && npm run codesign",
"pack:win32": "electron-packager . $npm_package_productName --out=dist/win --platform=win32 --arch=ia32",
"pack:win64": "electron-packager . $npm_package_productName --out=dist/win --platform=win32 --arch=x64 --version=0.36.2 app-version=1.0 --icon=assets/build/win/icon.ico",
"build": "npm run pack:osx && npm run pack:win32 && npm run pack:win64"

npm run build to start the process..

Answer 1

Solution:

I had to install wine on my OSX. Otherwise it is not possible to build the windows exe with the --icon tag. Why? Because electron-packager uses node-rcedit for that, which requires wine.

in my package.json:

"pack:osx": "electron-packager . $npm_package_productName --out=dist/osx --platform=darwin --arch=x64 --icon=assets/build/osx/icon.icns && npm run codesign",
"pack:win32": "electron-packager . $npm_package_productName --out=dist/win --platform=win32 --arch=ia32",
"pack:win64": "electron-packager . $npm_package_productName --out=dist/win --platform=win32 --arch=x64 --version=0.36.2 app-version=1.0 --icon=assets/build/win/icon.ico",
"build": "npm run pack:osx && npm run pack:win32 && npm run pack:win64"

npm run build to start the process..

Answer 2

You can package your electron app into an executable using electron-packager Which can be installed using

npm install --save-dev electron-packager

After that, run this command

• dir - specify app source is stored
• appName - The name you want to call the app
• option --icon helps you add an app icon, eg: mine is stored in build folder
• option --arch specifies target system architecture(s)
• version option for specifying the version of electron you are compiling with(look in package.json for specific of electron you are using)

run

npx electron-packager dir appName --overwrite --asar --electron-version=13.4.0 --platform=win32 --arch=x64 --prune=true --out=release-builds --icon=./build/icon.ico

These are some of the most important options. if you need any certifications, Let me know