如何更改ElectronJS App默认图标?

时间:2019-10-12 06:40:52

标签: angular electron electron-builder electron-packager

我是electronicjs的新手。我想将角度应用程序转换为桌面。我可以成功实现,但是问题是应用程序图标设置为默认电子,而不是我提供的图标,如下所示:

   win = new BrowserWindow({
    width: 600,
    height: 670,
    icon: `${__dirname}/dist/assets/imgs/logo.png`
  })

我在使用资源黑客构建应用程序后更改了图标,但我需要的是在构建时以正确的方式对其进行更改。我想念什么>

4 个答案:

答案 0 :(得分:4)

在main.js中,指定图标

win = new BrowserWindow({
 width: 800, 
 height: 600,
 icon: __dirname + '/Icon/Icon.icns'
})

您还可以使用辅助网址方法

const path = require('path')
const url = require('url')
const iconUrl = url.format({
 pathname: path.join(__dirname, 'Icon/Icon.icns'),
 protocol: 'file:',
 slashes: true
})

检查以供参考:https://medium.com/fantageek/changing-electron-app-icon-acf26906c5ad

答案 1 :(得分:1)

在主要过程中,您必须指定图标路径。在Windows中,图标必须是.ico或在Mac .icns中

const path = require('path')

      mainWindow = new BrowserWindow({
        width: 900,
        height: 700,
        icon: path.join(__dirname, './img/icon.ico');
        }
      })

答案 2 :(得分:0)

您可以根据启动的平台更改图标。

const iconPath = process.platform !== 'darwin'
    ? 'src/assets/icons/favicon.ico'
    : 'src/assets/icons/favicon.icns';

  // Create the browser window.
  win = new BrowserWindow({
    icon: path.join(__dirname, iconPath),
    x: 0,
    y: 0,
    width: size.width,
    height: size.height,
    webPreferences: {
      nodeIntegration: true,
      allowRunningInsecureContent: (serve) ? true : false,
      contextIsolation: false,  // false if you want to run e2e test with Spectron
      enableRemoteModule: true // true if you want to run e2e test  with Spectron or use remote module in renderer context (ie. Angular)
    },
  });

答案 3 :(得分:0)

您可以做的是在此处插入一行代码:

WIN = new BrowserWindow = ({
    // ...
    icon: __dirname + '/relative/path/to/your/icon/file'
   // ...
});