NW.js 入门指南 - HelloWorld开发者社区

本文同步至http://www.waylau.com/nwjs-quick-start/

本文介绍了 NW.js（node-webkit）的基本知识，通过本入门指南的学习，可以让你快速构建一个 NW.js 的桌面应用。

简介

NW.js （原名 node-webkit）是一个基于 Chromium 和 node.js 的应用运行时，通过它可以用 HTML 和 JavaScript 编写原生应用程序。它还允许您从 DOM 调用 Node.js 的模块，实现了一个用所有 Web 技术来写原生应用程序的新的开发模式。

这里是使用 NW.js 的应用和公司列表，可以看到 NW.js 实际应用效果。

功能特性

用现代 HTML5,CSS3,JS 和 WebGL 来编写应用程序。
完全支持 Node.js APIs 和所有其第三方模块.
良好的性能:Node 和 WebKit 运行在相同的线程:函数调用是更简洁;对象在同一堆可以互相引用;
容易打包和分发应用程序。
支持 Linux、Mac OS X 和 Windows

下载

地址: http://dl.nwjs.io/

v0.12.3: (Jul 31, 2015, based off of IO.js v1.2.0, Chromium 41.0.2272.76): release notes
Linux: 32bit / 64bit
Windows: 32bit / 64bit
Mac 10.7+: 32bit / 64bit
v0.13.0-alpha5: (Nov 2, 2015, based off of Node.js v5.0.0, Chromium 46.0.2490.80): release notes
NOTE You might want the SDK build. Please read the release notes
Linux: 32bit / 64bit
Windows: 32bit / 64bit
Mac 10.7+: 64bit
0.8.6: (Apr 18, 2014, based off of Node v0.10.22, Chrome 30.0.1599.66) If your native Node module works only with Node v0.10, then you should use node-webkit v0.8.x, which is also a maintained branch. More info
release notes
Linux: 32bit / 64bit
Windows: win32
Mac: 32bit, 10.7+
latest live build: git tip version; build triggered from every git commit: http://dl.nwjs.io/live-build/
老版本

快速入门

创建 index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>NW.js 快速入门|www.waylau.com</title>
  </head>
  <body>
    <h1>NW.js 快速入门</h1>
    We are using node.js <script>document.write(process.version)</script>.
    <br/>
    More demos,see <a href="http://www.waylau.com" title="更多示例">www.waylau.com</a>
  </body>
</html>

Create package.json:

{
  "name": "nw-quick-start-demo",
  "version": "0.0.1",
  "main": "index.html"
}

运行:

$ /path/to/nw .  (假设当前目录包含 'package.json')

注意: 在 Windows 系统, 拖动包含 package.json文件夹到 nw.exe 来打开它。

注意：在 OSX 系统,可执行编译文件是在隐藏目录的 .app 文件内。为了在 OSX 运行 node-webkit , 输入:
/path/to/nwjs.app/Contents/MacOS/nwjs . (假设当前目录包含 'package.json')

NW.js 入门指南

效果

NW.js 入门指南

更多设置

修改 package.json 来设置程序。

{
  "name": "nw-quick-start-window-demo",
  "version": "0.0.1",
  "main": "index.html",
  "window": {
    "title": "nw-quick-start-window-demo",
    "toolbar": false,
    "frame": true,
    "show_in_taskbar":true,
    "width": 800,
    "height": 500,
    "position": "mouse",
    "min_width": 400,
    "min_height": 200,
    "max_width": 800,
    "max_height": 600
  }
}

窗口外观常用属性包括：