使用 Electron 打包 Windows 可执行程序
使用 Electron 打包 Windows 可执行程序
在使用 Electron 构建桌面应用程序时，通常需要将项目打包为可执行文件（例如 .exe 文件），以便用户可以方便地安装和运行。本文将介绍如何使用 electron-builder 将 Electron 项目打包成 Windows 的可执行程序。
1. 安装依赖
首先，在你的项目中安装 electron-builder：
npm install --save-dev electron-builder
同时，确保你已经安装了 Node.js 和 npm。此外，还需要在项目根目录下创建或更新 package.json 文件以包含必要的配置信息。
2. 配置 package.json
编辑 package.json 文件，添加构建脚本和打包所需的配置：
{"name": "my-electron-app","version": "1.0.0","main": "main.js","scripts": {"start": "electron .","pack": "electron-builder --dir","dist": "electron-builder"},"build": {"appId": "com.example.my-electron-app","productName": "My Electron App","win": {"target": ["nsis" // 使用 NSIS 打包]}},"dependencies": {},"devDependencies": {"electron": "^23.0.0","electron-builder": "^23.6.0"}
}
这里有几个关键配置项：
appId: 应用程序的唯一标识符。productName: 应用程序的显示名称。win.target: 指定 Windows 打包目标，常用的有：nsis：使用 Nullsoft Scriptable Install System 创建安装程序。portable: 创建一个便携式应用程序。
3. 添加资源文件
为了生成更友好的应用图标和窗口图标，你可以在项目根目录下创建或更新以下文件：
build/resources/windows/icon.ico: 应用程序图标。build/resources/windows/splash-screen.png: 启动画面（可选）。
你可以使用在线工具将 PNG 图片转换为 ICO 格式，例如 ConvertICO 或其他类似服务。
4. 打包应用
现在可以运行打包命令来生成 Windows 可执行程序：
npm run dist
这会触发 electron-builder 进行构建，并在项目目录下的 dist 文件夹中生成安装文件。默认情况下，使用 NSIS 创建的安装程序将位于 dist/win-unpacked 目录下。
5. 验证打包结果
打开 dist/win-unpacked 文件夹，你应该会看到一个可执行文件（例如 My Electron App.exe），双击该文件即可启动你的应用程序。此外，你还可以找到相应的 .exe 和其他必要的资源文件。
如果你希望生成带有安装向导的安装程序（.exe 安装包），可以使用以下命令：
npm run dist
这会生成一个包含安装向导的 .exe 文件，通常位于 dist 目录下。
总结
通过上述步骤，你可以将 Electron 项目打包为 Windows 的可执行程序，并提供方便的安装体验。使用 electron-builder 可以轻松地管理和定制你的构建过程，确保生成的应用程序符合预期的需求和标准。希望这个指南对你有所帮助！