nw.js入门+桌面应用程序+自动更新——最易懂的教程

nw.js 是为了解决vue在xp 或window ie8及以下用户的兼容问题。曲线救国!!

一,下载nw.js

1.你可以从**官网获取最新版本的文件,或通过源代码构建.
一定要下载sdk版本!
nw.js入门+桌面应用程序+自动更新——最易懂的教程_第1张图片
2.下载的文件解压缩后你会看到如下图的文件目录 以下称为“解压目录”
nw.js入门+桌面应用程序+自动更新——最易懂的教程_第2张图片
3. 接下来需要新建两个页面分别是内容展示
index.html**,和配置设置的package.json

3.1 index.html我们先随意整点内容:

nw.js入门+桌面应用程序+自动更新——最易懂的教程_第3张图片

3.2package.json初级版本

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

毕竟是配置文件,我们可以多加一些参数如下:

  {
  "name": "newProgram",
  "version": "0.1.0",
  "description": "nw.js demo",
  "main": "index.html",
  "window": {
    "title": "nw-demo", // 应用标题
    "width": 840, // 应用初始化宽度
    "height": 600, // 应用初始化高度
    "toolbar": true, // 是否开启调试工具
    "resizable": false, // 应用是否可以调整高度以及宽度
    "icon": "images/icon.png" // 应用图标路径(相对路径)
  },

4.将你的index.html文件夹拖到上面 解压目录 中nw.exe上方即可运行为桌面程序了**_**

除此还可以配好环境变量后用代码运行 :
解压目录 按下shift+鼠标右键,选择"在此处打开命令窗口"。然后输入nw newProgram即可看到运行效果。注意建议使用cmd,不要使用powershell。我使用powershell必须使用 ./nw 才可以

nw.js入门+桌面应用程序+自动更新——最易懂的教程_第4张图片

二,打包为桌面程序.exe

  1. 解压目录 中新建package.nw目录,这时候package.nw目录和nw.exe在同级目录下!

  2. 把刚才新建的package.json都复制/移动到package.nw目录中,注意package.json需要在package.nw直接目录下。

  3. 打开你的编辑器终端或者直接调出cmd,在 解压目录 下(即:此目录下有package.nw目录和nw.exe文件),输入下面这行命令即可得到打包后的可执行程序*.exe文件:

copy /b nw.exe+package.nw newProgram.exe

nw.js入门+桌面应用程序+自动更新——最易懂的教程_第5张图片

**这是win系统上自带的合并文件命令。copy /b是系统命令,1+2+3中+号连接的是你要合并的文件,空格后是你合并出来的文件名 **

注意:如果你的编辑器是vs自动打开的是powershell终端,则上面的命令会执行报错,看下图选择默认shell选择cmd即可!
nw.js入门+桌面应用程序+自动更新——最易懂的教程_第6张图片
nw.js入门+桌面应用程序+自动更新——最易懂的教程_第7张图片

三,自动更新

			未完续贷

你可能感兴趣的:(vue,兼容xp,nw.js使用教程)