原文地址:使用nwjs-builder-phoenix构建跨平台桌面应用程序 - BIGTREE ()
NW.js应用自动打包的两种方式:
nwjs-builder-phoenix(推荐)
nw-builder
本文主要讲述使用nwjs-builder-phoenix构建跨平台桌面应用程序,对NW.js项目进行自动化打包。
具体步骤如下:
(1)创建firstapp应用;
(2)修改package.json打包配置;
(3)安装nwjs-builder-phoenix依赖、运行及打包;
通过build --tasks win-x86,win-x64,mac-x64 --mirror/mirrors/nwjs/.命令来实现不同平台的打包。
1、创建firstapp应用
1.1执行npm init初始化应用
D:\whw\study\nwjs\firstapp>npm initThis utility will walk you through creating a package.json file.It only covers the most common items, and tries to guess sensible defaults.See `npm help init` for definitive documentation on these fieldsand exactly what they do.Use `npm install <pkg>` afterwards to install a package andsave it as a dependency in the package.json file.Press ^C at any time to quit.package name: (firstapp)version: (1.0.0)description: first Nw.js Demoentry point: (index.js) index.htmltest command:git repository:keywords:author: whwlicense: (ISC)About to write to D:\whw\study\nwjs\firstapp\package.json:{"name": "firstapp","version": "1.0.0","description": "first Nw.js Demo","main": "index.html","scripts": {"test": "echo \"Error: no test specified\" && exit 1"},"author": "whw","license": "ISC"}Is this OK? (yes) yesD:\whw\study\nwjs\firstapp>
1.2创建index.html文件
文件内容:
<!DOCTYPE html><html><head><title>Hello World!</title></head><body><h1>Hello World!</h1></body></html>
2、修改package.json打包配置
新增以下依赖及构建配置:
"build": {"nwVersion": "0.41.2"},"scripts": {"dev": "run -x86 --mirror /mirrors/nwjs/ .","build": "build --tasks win-x86,win-x64,mac-x64 --mirror /mirrors/nwjs/ ."},"devDependencies": {"nwjs-builder-phoenix": "^1.14.3"}
完整的package.json内容如下所示:
{"name": "helloworld","main": "index.html","version": "0.0.1","description": "first Nw.js Demo","build": {"nwVersion": "0.41.2"},"scripts": {"dev": "run -x86 --mirror /mirrors/nwjs/ .","build": "build --tasks win-x86,win-x64,mac-x64 --mirror /mirrors/nwjs/ ."},"devDependencies": {"nwjs-builder-phoenix": "^1.14.3"},"author": "","license": "ISC"}
3、安装依赖、运行及打包
安装应用依赖:npm i 或 npm install
运行NW.js应用:npm run dev
如果能正常打开如下窗口,则说明NW.js应用已成功运行。
nwjs-03.png
打包NW.js应用:npm run build
打包日志如下:
D:\whw\study\nwjs\firstapp>npm run build> firstapp@1.0.0 build> build --tasks win-x86,win-x64,mac-x64 --mirror /mirrors/nwjs/ .Starting building tasks... {tasks: [ [ 'win', 'x86' ], [ 'win', 'x64' ], [ 'mac', 'x64' ] ],concurrent: false}Building for win, x86 starts...Fetching NW.js binary... { platform: 'win', arch: 'x86', version: '0.41.2', flavor: 'normal' }[===============================================---] 10508.82KB/s 0.5sBuilding targets...Building directory target starts...Building directory target ends within 4.44s.Building for win, x86 ends within 13.74s.Building for win, x64 starts...Fetching NW.js binary... { platform: 'win', arch: 'x64', version: '0.41.2', flavor: 'normal' }[==================================================] 9293.34KB/s 0.0sBuilding targets...Building directory target starts...Building directory target ends within 4.93s.Building for win, x64 ends within 15.52s.Building for mac, x64 starts...Fetching NW.js binary... { platform: 'mac', arch: 'x64', version: '0.41.2', flavor: 'normal' }[==============================================----] 9947.31KB/s 0.9sBuilding targets...Building directory target starts...Building directory target ends within 4.83s.Building for mac, x64 ends within 17.78s.D:\whw\study\nwjs\firstapp>
打包完之后,进入应用根目录dist文件夹下查看,可以看到不同平台对应的文件包:
nwjs-04.png
如上,即表示打包成功。
参考:
nwjs-builder-phoenix使用
/evshiron/nwjs-builder-phoenix
原文地址:使用nwjs-builder-phoenix构建跨平台桌面应用程序 - BIGTREE
(完)