Electron-vue: Changing icon not working

[xgdgsc]

Describe the issue / bug

Changing icon files in build/icons folder not working when I run npm run dev. It still shows default electron icon.

Tell me about your development environment.

• Node version: v9.2.0
• NPM version: 5.6.0
• Operating System: archlinux

[long-woo]

only valid after build

[peteringram0]

Im getting the same issue when running build.

[codetheorist]

I'm getting the same issue here too.

I've also deleted the node_modules folder and reinstalled all modules.

[codetheorist]

Also, running on Windows 10, building and compiling for Universal Window Platform.

Same results, no matter what. Icon never changes from the dark electron icon.

[ispal]

Same here, can't get the app icon to work

[ispal]

FYI: My problem was that the .icns file was "corrupted". I was using a web converter and it seems that didn't create correct file. I downloaded Image2Icon app from Apple's App Store and converted .png to .icns using that and now the icon works.

This was of course for MacOs

[canaan5]

Still having same issue, any solution yet?

[codetheorist]

@ispal It seemed that the service I used to generate my icons were causing the issue.

If you are on Windows, you must still have a full set of valid icons for any of them to compile properly. However, during the process, I did completely uninstall the app before reinstalling, rather than just updating the existing app.

[Quadriphobs1]

It seems the icon isn't just working in development mode but whe you are in production it works, also trying to set browserwindow icon still don't work, is there any other ways to get around this

[lvarado]

@Quadriphobs1 If you are on macOS, this is a known issue with Electron and AFAIK won't or can't be fixed. There is a workaround, however:

1. Open your project in Finder, browse to node_modules/electron/dist/
2. Select Electron.app and press ⌘I (or File > Get Info in the menubar)
3. With the info window still open, use Finder to browse to your .icns file
4. Drag and drop your .icns file onto the icon in the top left of the Electron.app info window. It's the icon at the top, next to the modified date and size.

With that done, you'll see your custom icon in the info window, and dev builds will now use the custom icon. Keep in mind you may need to repeat this process whenever you update the Electron package.

edit: found out you can use this same process with any file or folder, by the way. I applied my custom icon to the project folder as well for extra cool points.

[Quadriphobs1]

I am actually using window

On Fri, Mar 23, 2018, 19:21 alvarado [e-mail] wrote:

@Quadriphobs1 http:///Quadriphobs1 If you are on macOS, this is a known
issue with Electron and AFAIK won't or can't be fixed. There is a
workaround, however:

1. Open your project in Finder, browse to node_modules/electron/dist/
2. Select Electron.app and press ⌘I (or File > Get Info in the
   menubar)
3. With the info window still open, use Finder to browse to your .icns
   file
4. Drag and drop your .icns file onto the icon in the top left of the
   Electron.app info window. It's the icon at the top, next to the
   modified date and size.

With that done, you'll see your custom icon in the info window, and dev
builds will now use the custom icon. Keep in mind you may need to repeat
this process whenever you update the Electron package.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/SimulatedGREG/electron-vue/issues/478#issuecomment-375757764,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ATSusATtmrNP0y7jkeREQ-uHnYgCiINKks5thT09gaJpZM4Q74Z2
.

[XanderLuciano]

This issue appears to be resolved by the workaround mentioned above.