快速入门

NW.js基于Chromium 和 Node.js. NW.js利用Web技术结合Node.js及其模块进行桌面应用开发.

获取 NW.js

您可以从官网获取最新版本的文件,或通过源代码构建.

!!! 注意 : 推荐选择SDK构建方式开发应用 , 这样就可以使用开发工具进行调试 , 参考构建方式章节查看构建方式之间的区别.

开发NW.js应用

例子 1 - Hello World

快速开发一个NW.js应用.

步骤 1. 创建 package.json:

  1. {
  2.   "name": "helloworld",
  3.   "main": "index.html"
  4. }

package.json是JSON 格式格式的配置文件. main 属性定义了应用首页, 如本例的 "index.html". name则定义了应用名称. 具体查看 配置文件章节.

!!! “main属性定义为js文件”需知: 您可以将 "main"属性设置如 "main.js"的js文件. 该文件在应用启动时默认不打开窗口并在后台执行。 您可以稍后进行一些初始化并手动打开窗口。 例如:

  1. // 初始化你的应用程序之后 ...
  2. nw.Window.open('index.html', {}, function(win) {});

步骤 2. 创建 index.html文件:

  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <title>Hello World!</title>
  5.   </head>
  6.   <body>
  7.     <h1>Hello World!</h1>
  8.   </body>
  9. </html>

步骤 3. 运行应用

  1. cd /path/to/your/app
  2. /path/to/nw .

/path/to/nw 是NW.js执行文件.

  • Windows系统中是 nw.exe;
  • Linux系统中是 nw;
  • Mac系统中是 nwjs.app/Contents/MacOS/nwjs;

!!! “Windows中的拖拽”需知: Windows系统中 , 可拖拽包含 package.json的文件夹至 nw.exe直接运行应用.

例子 2 - 使用 NW.js APIs

NW.js中的APIs都被加载到 nw全局对象中 , 并能够在JavaScript代码中直接使用 . 更多细节请参考API文档

本例子以 index.html为例展示了如何创建应用菜单:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <title>上下文菜单</title>
  5. </head>
  6. <body style="width: 100%; height: 100%;">
  7.  
  8. <p>右击显示上下文菜单</p>
  9.  
  10. <script>
  11. // 创建一个空菜单
  12. var menu = new nw.Menu();
  13.  
  14. // 添加菜单项
  15. menu.append(new nw.MenuItem({
  16.   label: '项 A',
  17.   click: function(){
  18.     alert('You have clicked at "项 A"');
  19.   }
  20. }));
  21. menu.append(new nw.MenuItem({ label: '项 B' }));
  22. menu.append(new nw.MenuItem({ type: 'separator' }));
  23. menu.append(new nw.MenuItem({ label: '项 C' }));
  24.  
  25. // 监听事件
  26. document.body.addEventListener('contextmenu', function(ev) {
  27.   // 阻止显示默认菜单
  28.   ev.preventDefault();
  29.   // 点击处弹出定义的菜单对象
  30.   menu.popup(ev.x, ev.y);
  31.  
  32.   return false;
  33. }, false);
  34.  
  35. </script>  
  36. </body>
  37. </html>

… 运行应用:

  1. cd /path/to/your/app
  2. /path/to/nw .

!!! “require(‘nw.gui’)”需知: 同样支持旧版加载 nw方式 require('nw.gui') , 返回 nw对象 .

例子 3 - 使用 Node.js API

你可以使用DOM直接调用node.js代码以及模块 . 这样就可以通过Nw.js轻松开发桌面应用 .

本例子以 index.html为例展示了利用Node.js的 os模块查询操作系统信息:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <title>My OS Platform</title>
  5. </head>
  6. <body>
  7. <script>
  8. // 使用node.js获取系统信息
  9. var os = require('os');
  10. document.write('您当前系统为 ', os.platform());
  11. </script>
  12. </body>
  13. </html>

您可以在在NW.js中通过npm 进行模块的安装 .

!!! “Node原生模块”需知: 当使用 npm install构建原生模块时无法兼容 NW.js ABI. 如需使用则需要根据 nw-gyp进行NW.js的重建. 详细参考使用原生模块章节.

下一步该做什么

参考开发工具与调试进行开发以及调试应用 .

参考打包与发布进行开发以及调试应用 .

参考FAQ解决你可能遇到的问题 .

帮助

NW.js wiki中提供了很多干货,可能很有帮助.

您可以在mail list on Google group或 Gitter留言.

Bugs和需求可以提交到GitHub