中文代码示例之NW.js桌面应用开发初体验
先看到了NW.js(应该是前身node-webkit的缩写? 觉得该起个更讲究的名字, 如果是NorthWest之意的话, logo(见下)里的指南针好像也没指着西北啊)和Electron的比较文章: Why I prefer NW.js over Electron? (2018 comparison)

之后在看NW.js创始者(Wang WenRui)的推时不意发现微信小程序用了此框架. 也许与它对老系统如Windows XP的支持有关. 必须体验一下!
下面完成与中文编程:中文代码示例之Electron桌面应用开发初体验相同的功能, 作一个比较.
package.json
{
"name": "hello",
"main": "主页.html",
"version": "1.0.0",
"window":{
"min_width":800,
"min_height":400
}
}
主页.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>吃了么?</title>
</head>
<body>
<h1>吃了么?</h1>
我们用了Node <script>document.write(process.versions.node)</script>
, flavor <script>document.write(process.versions['nw-flavor'])</script>
<script>
nw.Window.get().showDevTools();
</script>
</body>
</html>
起初安装时用了Normal版, 将nwjs.app移到了/Applications下(Mac环境)
在目录下运行:
$ /Applications/nwjs.app/Contents/MacOS/nwjs .
发现弹出的开发者工具窗口为完全空白, 搜了一下发现官方的说明:
Debugging with DevTools
docs.nwjs.io
必须用"SDK Flavor", 但链接直接引向了从源码构建NW: Build Flavors - NW.js Documentation
正纠结是否要着手构建, 想起之前有个"SDK"版本下载, 试着下载解压后将nwjs.app文件(还有其他一些文件, 不知何用)移到/Applications下, 再次运行, 就成功如下打开了开发者窗口.

下面尝试官网第二个例子: Getting Started - NW.js Documentation. 显示上下文菜单:
菜单.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>上下文菜单</title>
</head>
<body style="width: 100%; height: 100%;">
<p>'右击'显示上下文菜单.</p>
<script>
// 创建空白上下文菜单
var 菜单 = new nw.Menu();
菜单.append(new nw.MenuItem({
label: 'A项',
click: function(){
alert('你点了"A项"');
}
}));
菜单.append(new nw.MenuItem({ label: 'B项' }));
菜单.append(new nw.MenuItem({ type: 'separator' }));
菜单.append(new nw.MenuItem({ label: 'C项' }));
// Hooks the "context菜单" event
document.body.addEventListener('contextmenu', function(事件) {
// 避免显示默认菜单
事件.preventDefault();
// 在点击处弹出菜单
菜单.popup(事件.x, 事件.y);
return false;
}, false);
</script>
</body>
</html>
运行后随意点击窗口中央发现菜单并非期望:

后发现有效区域仅在上部:

查看开发者工具, 的确body仅在上部:

为啥height: 100%无效呢?
初感
官方文档的门槛略高(另外似乎无中文版?), 上面的问题应该会影响新手接纳程度. 也许是目标群体定位与Electron不同?
参考:
官方文档: Getting Started - NW.js Documentation
中文代码示例之NW.js桌面应用开发初体验的更多相关文章
- NW.js桌面应用开发(一)
NWjs中文网 Electron中文网 一些需要了解的历史与特性,其实就是 NW.js 和 Electron的争议,建议还是亲自阅读一下各自的官网说明 1.下载SDK版工具 从淘宝NPM镜像下载,速度 ...
- nw.js桌面软件开发系列 第0.1节 HTML5和桌面软件开发的碰撞
第0.1节 HTML5和桌面软件开发的碰撞 当我们谈论桌面软件开发技术的时候,你会想到什么?如果不对技术本身进行更为深入的探讨,在我的世界里,有这么多技术概念可以被罗列出来(请原谅我本质上是一个Win ...
- 中文代码示例之Electron桌面应用开发初体验
参考: 打造你的第一个 Electron 应用 首先运行下面在目录下创建package.json: $ npm init 去掉了一些无关项后内容如下: { "name": &quo ...
- nw.js桌面程序自动更新(node.js表白记)
Hello Google Node.js 一个基于Google V8 的JavaScript引擎. 一个伟大的端至端语言,或许我对你的热爱源自于web这门极富情感的技术吧! 注: 光阴似水,人生若梦, ...
- 中文代码示例之Angular入门教程尝试
原址: https://zhuanlan.zhihu.com/p/30853705 原文: 中文代码示例教程之Angular尝试 为了检验中文命名在Angular中的支持程度, 把Angular官方入 ...
- 2017-11-07 中文代码示例之Angular入门教程尝试
"中文编程"知乎专栏原址 原文: 中文代码示例教程之Angular尝试 为了检验中文命名在Angular中的支持程度, 把Angular官方入门教程的示例代码中尽量使用了中文命名. ...
- 中文代码示例之Vuejs入门教程(一)
原址: https://zhuanlan.zhihu.com/p/30917346 为了检验中文命名在主流框架中的支持程度, 在vuejs官方入门教程第一部分的示例代码中尽量使用了中文命名. 所有演示 ...
- 2018-12-09 疑似bug_中文代码示例之Programming in Scala笔记第九十章
续前文: 中文代码示例之Programming in Scala笔记第七八章 源文档库: program-in-chinese/Programming_in_Scala_study_notes_zh ...
- 2018-11-27 中文代码示例之Programming in Scala笔记第七八章
续前文: 中文代码示例之Programming in Scala学习笔记第二三章 中文代码示例之Programming in Scala笔记第四五六章. 同样仅节选有意思的例程部分作演示之用. 源文档 ...
随机推荐
- 常见的anaconda的操作
以前对anaconda的理解比较少,以为它就是一个比较大的python库,现在发现它原来不止是这样,它还有很多其他用途. Anaconda指的是一个开源的Python发行版本,其包含了conda.Py ...
- PHP之ThinkPHP框架(验证码、文件上传、图片处理)
验证码 验证码是框架自带有的,比之前使用GD库简单方便许多,其实现原理基本相似,都是生成图片,保存验证码值到Session中,表单提交验证码,然后进行值的对比验证. 简单的显示: <form ...
- 【MML】华为MML AAA接口联调,Java版本
1.我们先设置一些常量数据 package cn.cutter.ztesoft.HuWeiMML.constrant; /** * @description: AAA接口常量设置 * @author: ...
- IdentityServer4(8)- 使用密码认证方式控制API访问(资源所有者密码授权模式)
一.前言 本文已经更新到 .NET Core 2.2 OAuth 2.0 资源所有者密码模式允许客户端向令牌服务发送用户名和密码,并获取代表该用户的访问令牌. 除了通过无法浏览器进行交互的应用程序之外 ...
- new Date()浏览器兼容性问题
不同浏览器有不同的差异,一般时间格式是“2018-11-13”,这种格式在Chrome下是可以正常执行的,不过在ie浏览器里面 就会变成NaN 解决方法:将时间转换成“2018/11/13” 这种格式 ...
- java如何获取一个double的小数位数
前言 看标题是不是觉得这是一个很简单的问题,我一开始也是这么认为的,但是实际情况下,在各种情况下我们都进行了测试,发现很多实际情况是无法不尽如人意的. 方法分析 当前能想到的比较容易有下面几种 1.直 ...
- 了解Java内存模型,看完这一篇就够了
前言(此文草稿是年前写的,但由于杂事甚多一直未完善好.清明假无事,便收收尾发布了) 年关将近,个人工作学习怠惰了不少.两年前刚做开发的时候,信心满满想看看一个人通过自己的努力,最终能达到一个什么样的高 ...
- AutoFac (控制反转IOC 与依赖注入DI)
重要的参考资料http://www.cnblogs.com/xdp-gacl/p/4249939.html 谈谈对Spring IOC的理解 IOC概念(很重要) 项目 先引入AutoFac 和Aut ...
- SpringMVC学习(二)———— 参数绑定
一.参数绑定 1.1.什么是参数绑定? 客户在浏览器端会提交一些参数到服务器端,比如用户的登录等,就会传username 和 password过来,springmvc则通过参数绑定组件将请求参数的内容 ...
- man statd(rpc.statd中文手册)
本人译作集合:http://www.cnblogs.com/f-ck-need-u/p/7048359.html rpc.statd程序主要实现NFS锁相关内容,如普通的文件锁(NLM.NSM).文件 ...