Electron Packager - 为OSX和Windows设置应用程序图标

Question

Electron Packager - 为OSX和Windows设置应用程序图标

electron

27

我正在使用electron packager为Windows和OSX平台构建我的electron应用程序。

package.json:

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

我使用npm run build命令来运行构建过程。

问题：

如何在我的package.json中使用electron packager脚本来设置Windows和OSX的图标？

问题描述：

上述脚本仅为OSX设置应用程序图标。因此，它不能为Windows应用程序设置图标（NPM会报错）。

解决方法：

我需要在我的OSX上安装wine才能使用--icon标签构建Windows exe文件。为什么？因为electron-packager使用node-rcedit进行操作，而node-rcedit需要wine支持。

在我的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 开始进程。

- MarcJohnson

2

“--icon=icon.ico” 对我不起作用。有什么想法吗？可能是缺少 npm 包吗？ - MarcJohnson

我发现在OSX上构建Windows应用程序时，我需要安装Wine。但是现在我遇到了以下错误：wine:'/Users/X/.wine'是一个64位的安装程序，它不能与32位的wineserver一起使用。未定义 有什么想法吗？ - MarcJohnson

我从我的系统（osx）中删除了Wine，并使用brew install wine重新安装了它。现在一切都正常工作了。我已经调整了上面的解决方案！ - MarcJohnson

你能把你的解决方案移到一个单独的答案中并标记问题已解决吗？尽管你已经找到了解决方案，但它仍然显示为未回答。 - 16patsle

3个回答

5

你可以使用electron-packager将你的Electron应用程序打包成可执行文件，其可以通过以下方式进行安装。

npm install --save-dev electron-packager

接下来，请运行以下命令

dir - 指定应用程序源代码存储的位置
appName - 你想要给这个应用程序起的名称
选项--icon可以帮助你添加一个应用程序图标，例如：我的应用程序图标存储在build文件夹中
选项--arch指定目标系统的体系结构
version选项用于指定正在编译的Electron版本（请查看package.json获取你正在使用的Electron版本的详细信息）

运行

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

以下是一些最重要的选项。如果您需要任何认证，请告诉我。

- Osei-Owusu

1

你的回答更新得很好，看起来更加详细了。 - Trenton McKinney

我正在运行这个命令 "electron-packager . appName --overwrite --asar --platform=linux --arch=x64 --icon=src/assets/images/logos/logo-72x72.png --prune=true --out=release-builds"，但是打包没有进行。Node 版本是 15.3，请问你能帮忙吗？ - sajalsuraj

npx electron-packager . 应用名称 --overwrite --asar --platform=linux --arch=x64 --icon=src/assets/images/logos/logo-72x72.png --prune=true --out=release-builds - Osei-Owusu

在您的项目目录中运行该命令。输出将存储在release-builds中。其次，每个Electron版本都附带了自己安装的node版本。 - Osei-Owusu

如果您还没有安装npx，请先安装它。npx允许您使用Node包而无需安装其依赖项。 - Osei-Owusu

你的命令看起来没问题，但尝试第二个命令，让我们看看会发生什么，记得安装npx，如果你还没有安装，npx允许你使用node包而无需安装其依赖项。 - Osei-Owusu

4

天啊，我花了很长时间才弄清楚。应用程序名称不能包含任何非法字符（如大写字母或连字符等）。奇怪的是，可执行文件的名称使用这些“非法”字符将被正确生成，但图标将无法应用！

错误格式

electron-packager ./electron APPLICATION-NAME --overwrite --asar --electron-version=13.1.7 --platform=win32 --arch=x64 --prune=true --out=release-builds --icon=./icon.ico"

正确格式

electron-packager ./electron applicationname --overwrite --asar --electron-version=13.1.7 --platform=win32 --arch=x64 --prune=true --out=release-builds --icon=./icon.ico"

- ProxyTech

1

哇，太感谢了伙计，你真的帮了我很大的忙。我狂按那个 ^ 赞同按钮！ - KhanKudo

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- MarcJohnson · Accepted Answer

解决方案：

我必须在我的OSX上安装wine。否则，使用--icon标记构建Windows exe是不可能的。为什么？因为electron-packager使用node-rcedit来实现这一点，而它需要wine。

在我的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来启动该过程。