Electron 앱의 앱 아이콘을 어떻게 설정합니까?
노력하고 BrowserWindow({icon:'path/to/image.png'});
있지만 작동하지 않습니다.
효과를 보려면 앱을 포장해야합니까?
답변
icon
작성시 특성을 설정하면 BrowserWindow
Windows 및 Linux에만 영향을줍니다.
OS X에서 아이콘을 설정하려면 전자 패키지를 사용하고 --icon
스위치를 사용하여 아이콘을 설정할 수 있습니다 .
OS X의 경우 .icns 형식 이어야합니다. .png에서이 파일을 만들 수 있는 온라인 아이콘 변환기 가 있습니다.
답변
아래는 내가 가진 솔루션입니다.
mainWindow = new BrowserWindow({width: 800, height: 600,icon: __dirname + '/Bluetooth.ico'});
답변
macOS에서도 가능합니다. 코드를 통하지 않고 몇 가지 간단한 단계를 수행하십시오.
- 사용하려는 .icns 파일을 찾아서 편집 메뉴를 통해 복사하십시오.
- 일반적으로 node_modules / electron / dist에서 electron.app를 찾으십시오.
- 정보 창을 엽니 다
- 왼쪽 상단에서 아이콘을 선택하십시오 (주변의 회색 테두리).
- cmd + v를 통해 아이콘 붙여 넣기
- 개발 중 아이콘을 즐기십시오 🙂
실제로 그것은 전자에 국한되지 않는 일반적인 것입니다. 이와 같은 많은 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'));
__dirname
package.json
응용 프로그램 의 루트 디렉토리 (와 동일한 디렉토리 )를 가리 킵니다 .
답변
아이콘 파일 경로의 예제는 main.js가 기본 디렉토리 아래에 있다고 가정하는 경향이 있습니다. 파일이 앱의 기본 디렉토리에 없으면 경로 스펙이 해당 사실을 설명해야합니다.
예를 들어 main.js가 src / 서브 디렉토리에 있고 아이콘이 asset / icons /에 있으면이 아이콘 경로 스펙이 작동합니다.
icon: __dirname + "../assets/icons/icon.png"