Electron 앱의 앱 아이콘을 어떻게 설정합니까?

노력하고 BrowserWindow({icon:'path/to/image.png'});있지만 작동하지 않습니다.

효과를 보려면 앱을 포장해야합니까?

icon작성시 특성을 설정하면 BrowserWindowWindows 및 Linux에만 영향을줍니다.

OS X에서 아이콘을 설정하려면 전자 패키지를 사용하고 --icon스위치를 사용하여 아이콘을 설정할 수 있습니다 .

OS X의 경우 .icns 형식 이어야합니다. .png에서이 파일을 만들 수 있는 온라인 아이콘 변환기 가 있습니다.

아래는 내가 가진 솔루션입니다.

mainWindow = new BrowserWindow({width: 800, height: 600,icon: __dirname + '/Bluetooth.ico'});

macOS에서도 가능합니다. 코드를 통하지 않고 몇 가지 간단한 단계를 수행하십시오.

1. 사용하려는 .icns 파일을 찾아서 편집 메뉴를 통해 복사하십시오.
2. 일반적으로 node_modules / electron / dist에서 electron.app를 찾으십시오.
3. 정보 창을 엽니 다
4. 왼쪽 상단에서 아이콘을 선택하십시오 (주변의 회색 테두리).
5. cmd + v를 통해 아이콘 붙여 넣기
6. 개발 중 아이콘을 즐기십시오 :-)

실제로 그것은 전자에 국한되지 않는 일반적인 것입니다. 이와 같은 많은 macOS 응용 프로그램의 아이콘을 변경할 수 있습니다.

package.json이 업데이트되었습니다 .

"build": {
  "appId": "com.my-website.my-app",
  "productName": "MyApp",
  "copyright": "Copyright © 2019 ${author}",
  "mac": {
    "icon": "./public/icons/mac/icon.icns",     <---------- set Mac Icons
    "category": "public.app-category.utilities"
  },
  "win": {
    "icon": "./public/icons/png/256x256.png" <---------- set Win Icon
  },
  "files": [
    "./build/**/*",
    "./dist/**/*",
    "./node_modules/**/*",
    "./public/**/*",       <---------- need for get access to icons
    "*.js"
  ],
  "directories": {
    "buildResources": "public" <---------- folder where placed icons
  }
},

응용 프로그램을 빌드 한 후 아이콘을 볼 수 있습니다. 이 솔루션은 개발자 모드에서 아이콘을 표시하지 않습니다. 에 아이콘을 설정하지 않았습니다 new BrowserWindow().

전자 빌더 는 아이콘을 지원합니다

작업 표시 줄에서 앱 아이콘을 업데이트하려면 main.js에서 다음을 업데이트하십시오 (typescript를 사용하는 경우 main.ts).

win.setIcon(path.join(__dirname, '/src/assets/logo-small.png'));

__dirnamepackage.json응용 프로그램 의 루트 디렉토리 (와 동일한 디렉토리 )를 가리 킵니다 .

아이콘 파일 경로의 예제는 main.js가 기본 디렉토리 아래에 있다고 가정하는 경향이 있습니다. 파일이 앱의 기본 디렉토리에 없으면 경로 스펙이 해당 사실을 설명해야합니다.

예를 들어 main.js가 src / 서브 디렉토리에 있고 아이콘이 asset / icons /에 있으면이 아이콘 경로 스펙이 작동합니다.

icon: __dirname + "../assets/icons/icon.png"

전자 포장기

을 사용하여 OS X에서 아이콘을 설정하려면 electron-packager--icon 스위치를 사용하여 아이콘을 설정하십시오.

OS X의 경우 .icns 형식이어야합니다. .png에서이 파일을 만들 수있는 온라인 아이콘 변환기가 있습니다.

전자 빌더

1. build프로젝트 디렉토리에 이름이 지정된 디렉토리를 작성하고 이름이 지정된 디렉토리 .icns에 아이콘을 넣으십시오 icon.icns.
2. command를 실행하여 빌더를 실행하십시오 electron-builder --dir.

응용 프로그램 아이콘이 해당 디렉토리 위치에서 자동으로 선택되어 패키징하는 동안 응용 프로그램에 사용됩니다.

참고 : 주어진 답변은 최신 버전의 electron-builder전자 빌드 v21.2.0에 대한 것이며