您当前的位置: 首页 > 

任磊abc

暂无认证

  • 2浏览

    0关注

    182博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

nw.js初探

任磊abc 发布时间:2020-08-12 15:59:54 ,浏览量:2

NW.js由node-webkit项目发展而来 其实很多东西官网上都有。但是鉴于搜索引擎(百度,google)搜索到的相关文章,让人看的很不明白。所以决定写下此篇文章。 官网:https://nwjs.io/ 中文文档:http://nwjs-cn.readthedocs.io/zh_CN/latest/index.html 淘宝镜像安装:https://npm.taobao.org/mirrors/nwjs/v0.47.0/1.nw.js是干嘛的? 官网上的解释: NW.js基于Chromium和Node.js . NW.js能够通过页面技术开发桌面应用 , 同时可以调用Node.js代码以及模块 . 未来 , 你可以使用NW.js轻松将页面应用制作成桌面应用 . 简单的说,就是用web技术开发跨平台PC桌面应用。

2、下载nw.js

nwjs下载包一个是Normal版本,一个是SDK版本,如果是做开发测试,则需要下载SDK版本,SDK版本可以使用开发工具进行debug等;

如果直接在官网上下载的话会很慢,因此选择从淘宝NPM镜像下载,速度飞快,我选择最的 https://npm.taobao.org/mirrors/nwjs/v0.47.0/ 上下载;

3、win开发版本配置

开发NW.js应用 例子 1 - Hello World

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

步骤 1. 创建 package.json:

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

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

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

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

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



  
    Hello World!
  
  
    Hello World!
  

步骤 3. 运行应用

【注意】 "Windows中"需知:

1、 将包含 `package.json`的文件夹压缩为zip格式,比如压缩完成后为dist.zip;

2、 将dist.zip文件修改为文件名为package.nw;

3、 将package.nw拖拽至与 `nw.exe`为同级目录后,直接运行应用.

【注意】 "mac中"需知:

1、 将包含 `package.json`的文件夹压缩为zip格式,比如压缩完成后为dist.zip;

2、 将dist.zip文件修改为文件名为app.nw;

3、 将package.nw拖拽至nwjs-sdk-v0.47.0-osx-x64\nwjs.app\Contents\Resources,

然后使用命令运行应用:

/nwjs-sdk-v0.47.0-osx-x64/nwjs.app/Contents/MacOS/nwjs .

步骤 4. 应用调试

!!! 注 "仅适用SDK构造方式" 开发工具只能在SDK构造方式中使用 , 参考SDK构造 . 推荐使用SDK构造方式进行开发和测试 , 其他构造方式发布应用 .

Open Developer Tools 开启开发工具

Windows和Linux系统中使用快捷键F12开启 , Mac系统中使用+⌥+i .

此外 , windows系统中可以使用win.showDevTools()`开启开发工具进行编程 .

关注
打赏
1656830895
查看更多评论
立即登录/注册

微信扫码登录

0.0388s