nw.js学习笔记

一、初识Nw.js

NW.js是基于 Chromium和 Node.js 运行的, 以前也叫node-Webkit。顾名思义底层核心在于node层及webkit内核。在应用里你可以直接调用Node.js的各种api以及现有的第三方包。因为Chromium和 Node.js 的跨平台,那么你的应用也是可以跨平台的。

二、创建helloWorld

1. 因为项目中需要完成对xp系统的支持,而nwjs只有0.14.7版能支持xp,所以这里使用0.14.7的版本来完成搭建。 这里选用了SDK版,也是因为需要使用到浏览器调试功能,如果不需要你可以选择其他版本。

2. 这个时候我们应该得到了这样一个文件,内容如图

nw.js学习笔记_第1张图片

3. 现在开始创建我们项目文件。在该目录下创建一个app文件夹。里面应该至少包含index.html和package.json这两个文件。当然还可以加入其它assets等文件夹,就像平时我们所熟悉的开发方式一样。

4. 如果你只是想尝试让nwjs运行起来,pack.json文件里支需要加入main和name配置就行了。就像这样

nw.js学习笔记_第2张图片

当然package.json的配置项远远不止两个。具体可以参考这里:

官方文档:https://nwjs.org.cn/doc/api/Manifest-Format.html

网友总结:http://www.cnblogs.com/jinling/p/6165277.html

5. index.html里就更简单明了。

nw.js学习笔记_第3张图片

(说好的helloWorld呢???不好意思皮了一下)。

6. 最后把app文件夹拖动到nw.exe打开就行了


nw.js学习笔记_第4张图片


三、项目打包

1. 经过上面的操作后,想必各位已经得到一个运行成功的nw项目了。但是如果让用户手动拖放文件夹来打开项目这显然不太可能。(如果客户不介意的话也可以试试?),现在我们就试试把刚才的文件打包成为一个直接启动的exe文件。

2. 需要用到的工具:Enigma Virtual Box

3. 我们先把app文件夹中的文件打成一个名为app.zip的压缩包。压缩包内容如下

nw.js学习笔记_第5张图片

4. 然后我们将名字改为app.nw。此时项目结构如下。并在该目录下进入cmd。执行命令

copy /b nw.exe+app.nw app.exe

完成后在目录下得到一个app.exe文件。但是如果我们只给用户这个文件是不能用的。所以还得把这个文件和其他基础文件一起打个包。

5. 打开我们下载好的Enigma Virtual Box。

nw.js学习笔记_第6张图片

Ps:如果打包后被360识别为病毒(什么我居然会写木马!)

请参考这里:https://www.cnblogs.com/nuoku/p/3934639.html

6. 到现在就得到了一个能直接运行的exe文件了。

四、其他

其他更多配置如系统托盘设置,个性化图标等等都能在官网方文档找到你想要的。

0.14.7: http://dl.nwjs.io/v0.14.7/nwjs-sdk-v0.14.7-win-x64.zip

官网文档:https://nwjs.org.cn

系统托盘:https://blog.csdn.net/xzs_123/article/details/46634053

exe文件图标替换:http://keenwon.com/1311.html

Enigma Virtual Box: http://enigmaprotector.com/en/aboutvb.html

打包后识别问题: https://www.cnblogs.com/nuoku/p/3934639.html

你可能感兴趣的:(nw.js学习笔记)