如何打包分发NW.js应用:从package.nw到Windows/Linux/Mac安装包全流程
【免费下载链接】nw.jsCall all Node.js modules directly from DOM/WebWorker and enable a new way of writing applications with all Web technologies.项目地址: https://gitcode.com/gh_mirrors/nw/nw.js
打包分发 NW.js 应用,就是把你的应用代码、资源文件和 NW.js 运行时组合成package.nw(Mac 上叫app.nw),再为 Windows、Linux、Mac 分别生成可直接运行的目录或安装包。NW.js 让你可以直接从 DOM/WebWorker 中调用所有 Node.js 模块,用 Web 技术写出全新的桌面应用——而打包分发正是把这些应用交付给用户的关键一步。本文带你走完从准备应用到生成三大平台安装包的全流程。
一、NW.js 打包分发全流程概览
整个流程可以归纳为 5 个步骤,官方文档 docs/For Users/Package and Distribute.md 对此有完整说明:
| 步骤 | 内容 | 关键点 |
|---|---|---|
| 1. 准备应用 | 源码、资源、依赖装齐 | 每个目标平台都要重新npm install |
| 2. 准备运行时 | 选择合适的 build flavor | SDK 版含 DevTools,Normal 版体积最小 |
| 3. 打包应用 | 生成package.nw/app.nw | 普通文件或 zip 两种方式 |
| 4. 平台适配 | 图标、.desktop、签名 | Windows / Linux / Mac 各不相同 |
| 5. 制作安装包 | NSIS、Inno Setup、makeself 等 | 让最终用户一键安装 |
官方还推荐了自动化工具 nw-builder,可以一键完成上述打包过程;如果偏好手动操作,按下面的步骤来即可。
二、打包前准备:一份必查的清单
打包前请逐项确认,避免"在我机器上能跑、用户机器上就崩":
- 源代码和资源文件齐全
- 已执行
npm install安装依赖 - 原生 Node 模块已在目标平台重新编译(见 docs/For Users/Advanced/Use Native Node Modules.md)
- NaCl 二进制文件已构建(如需要,见 docs/For Users/Advanced/Use NaCl in NW.js.md)
- 源码已编译保护、原文件已移除(可选,见 docs/For Users/Advanced/Protect JavaScript Source Code.md)
- manifest 中声明的应用图标文件存在
三个新手最容易踩的坑:
- 依赖不能跨平台通吃:
node_modules是为某个平台装的,不代表在所有平台都能用。经验法则是在每个目标平台上都执行一次npm install。 - Linux/Mac 区分大小写:
test.js和Test.js是两个文件,路径大小写写错在 Linux 上会直接"崩给你看"。 - Windows 路径超 260 字符:老版本 NPM(<3.0)下
npm install容易触发路径过长错误,建议把项目放在C:\build\这类浅目录中构建。
此外,你的应用必须包含一个 package.json 清单文件,至少要有main(入口文件)和name(应用唯一名)两个字段,完整字段含义可查阅 docs/References/Manifest Format.md。
三、选择 NW.js 运行时:SDK 版还是 Normal 版?
你的应用必须随附 NW.js 运行时才能运行。NW.js 提供多种 build flavors 来平衡体积与能力:
- SDK flavor:内置 DevTools 与 NaCl 插件支持,能力最完整,适合开发调试;
- Normal flavor:去掉 DevTools 和 NaCl 的最小构建,体积最小,适合正式发布。
💡 小提示:代码里可以用
process.versions['nw-flavor']检查当前运行的是哪种 flavor。
下载的官方包中所有文件都应随产品重新分发,唯一例外是 SDK 版 tools 目录里的nwjc、payload、chromedriver——这些是开发工具,不需要发给用户。
四、打包你的应用:生成 package.nw 的两种方式
方式 1:普通文件(官方推荐)
不压缩,直接把应用文件和运行时放在一起,启动最快:
- Windows / Linux:应用文件与
nw(或nw.exe)放同一目录,确保package.json与nw同级;或者把应用文件放进名为package.nw的文件夹,再与nw/nw.exe放一起。 - Mac:把应用文件放进
nwjs.app/Contents/Resources/app.nw文件夹即可。
方式 2:Zip 压缩为 package.nw
把所有应用文件压缩成 zip 并改名为package.nw,与 Windows/Linux 运行时放在一起;Mac 上则命名为app.nw放入nwjs.app/Contents/Resources/。
⚠️注意:启动时 NW.js 会把 zip 包解压到临时目录再加载,包越大、文件越多,启动越慢。
Windows 和 Linux 上还可以把 zip 直接"藏"进可执行文件末尾,得到一个单文件应用:
copy /b nw.exe+package.nw app.execat nw package.nw > app && chmod +x app五、各平台安装与定制步骤
5.1 Windows:换图标 + 制作安装包
Windows 下主要做两件事:
- 替换 nw.exe 图标:可用 Resource Hacker 等工具修改可执行文件的资源。
- 制作安装程序:把运行时、
package.nw、图标等所有必要文件部署到用户系统,可选 Windows Installer、NSIS 或 Inno Setup 等主流方案。
5.2 Linux:创建 .desktop 文件 + 自解压安装包
- 为你的应用创建规范的
.desktop文件,让应用能出现在桌面和启动器中; - 制作自解压安装包:可用
shar、makeself这类脚本方案,用户双击脚本即可解压出整个应用; - 更"正规"的做法是按
apt、yum、pacman等包管理系统的官方文档打成系统包分发。
5.3 Mac:app.nw、图标与签名
Mac 上的定制点最多,需要修改以下内容:
| 文件 | 作用 |
|---|---|
Contents/Resources/nw.icns | 应用图标(可参考源码 src/mac/nw.icns 的位置约定) |
Contents/Info.plist | Apple 包描述文件,修改显示名、bundle id 等 |
Contents/MacOS/nwjs | 若改了可执行文件名,需同步重命名 |
package.json的product_string | 让 Helper 进程显示为"你的产品名 Helper" |
完整改名步骤(含 Helper 子应用目录重命名)见 docs/For Users/Package and Distribute.md 的 Mac 章节。
🔐重要:Mac 应用必须签名,否则在 Gatekeeper 开启的机器上用户根本无法启动应用。上架 Mac App Store 的细节见 docs/For Users/Advanced/Support for Mac App Store.md。
六、常见打包问题 FAQ
Q1:zip 版 package.nw 为什么启动慢?NW.js 启动时会将 zip 解压到临时目录再加载。包大或文件多时解压耗时明显,发布给终端用户时优先用"普通文件"方式。
Q2:Linux 上应用打不开,日志提示找不到文件?大概率是路径大小写不匹配。Linux 文件系统区分大小写,检查package.json中的main及所有引用路径。
Q3:Windows 下npm install报路径过长?把项目构建目录放到根目录下(如C:\build\),并升级 NPM 到 3.0 以上。
Q4:想保护 JS 源码怎么办?打包前用 SDK 版中的nwjc把源码编译为字节码,再移除原始 JS 文件,方法见 docs/For Users/Advanced/Protect JavaScript Source Code.md。
Q5:怎么确认用户装的是哪种运行时?在应用代码里读取process.versions['nw-flavor'],SDK 版和 Normal 版一目了然。
七、参考资料与源码索引
- 打包分发完整指南:docs/For Users/Package and Distribute.md
- 构建 NW.js 运行时(含 build flavors 源码构建):docs/For Developers/Building NW.js.md
- manifest 字段详解:docs/References/Manifest Format.md
- 窗口相关 API(打包后常用
nw.Window):docs/References/Window.md - 打包资源与清单示例:src/mac/app-Info.plist、src/mac/nw.icns
按"准备应用 → 选运行时 → 生成 package.nw → 平台定制 → 做安装包"这条主线走完,你的 NW.js 应用就能在三大平台上顺利交付给用户了。🚀
【免费下载链接】nw.jsCall all Node.js modules directly from DOM/WebWorker and enable a new way of writing applications with all Web technologies.项目地址: https://gitcode.com/gh_mirrors/nw/nw.js
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考