页面特效 UI组件库 菜单导航 窗口特效 幻灯片滑动 图像相册 表单 选项卡 表格 评分星级 手风琴 文本链接 布局 日历 颜色选择器 按钮 图表 html5 提示 ExtJS 在线客服 其他特效 地图 树形控件 移动开发 BootStrap 滑动条 文件上传 表单验证 分页 播放器 Angular VUE

NW.js构建跨平台桌面应用

布局 其它源码 HTML我帮您 1月前  次浏览

NW.js,跨平台,体积更小,功能更强大
使用nw.js封装网页,打包成独立应用
nw.js初探索,封装网页成为跨平台的独立应用。

从DOM/WebWorker层,直接调用所有的Node模块,
使用现有的web技术,开启一个全新的编写应用的方式。

使用HTML5、CSS3和WebGL等web技术,编写原生应用的新途径

全面支持所有浏览器特性

全面支持Node.js的API及所有第三方模块

可以从DOM和Web Worker层面,调用Node.js的模块

JavaScript源码保护
一次编写,就可以运行在多平台上,包括:Linux、Mac OS X和Windows


nw.js原名node-webkit,它通过Chromium内核,可以在node环境下模拟浏览器运行时,因此可以将js封装成独立应用如.deb, .exe, .app等,从而实现跨平台运行。此外,他还直接兼容Chrome打包程序(Packaged Apps),尤其适合在Chrome商店2016年停止上架新的打包程序之后,可以让原程序直接运行。

国内帮助地址:https://nwjs.org.cn/

nw.js 安装

1、官网地址https://nwjs.io/,选择对应你自己的系统,选择Normal下的最新安装包下载到本地,我的是Ubuntu64位,所以下载文件是nwjs-v0.35.4-linux-x64.tar.gz

或者直接打开http://dl.nwjs.io/选择版本、平台进行下载,个人感觉速度会快

2、解压进入

tar -zxvf nwjs-v0.35.4-linux-x64.tar.gz cd nwjs-v0.35.4-linux-x64 

3、检测能否正常运行,如果出现下图窗口,证明运行成功

./nw 

快速入门

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

获取 NW.js

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

【注意】 :

推荐选择SDK构建方式开发应用 , 这样就可以使用开发工具进行调试 , 参考[构建方式](Advanced/Build-Flavors.md)章节查看构建方式之间的区别. 

开发NW.js应用

例子 1 - Hello World

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

步骤 1. 创建 package.json:

{
  "name": "helloworld",
  "main": "index.html"
} 

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

【注意】 "main属性定义为js文件"需知:

您可以将 `"main"`属性设置如 `"main.js"`的js文件. 该文件在应用启动时默认不打开窗口并在后台执行。 您可以稍后进行一些初始化并手动打开窗口。 例如: 
// 初始化你的应用程序之后 ...
nw.Window.open('index.html', {}, function(win) {}); 

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

<!DOCTYPE html>
<html>
  <head>
    <title>Hello World!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
  </body>
</html> 

步骤 3. 运行应用

cd /path/to/your/app
/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`直接运行应用. 

相关链接

发表评论