下面我通过一个简单的demo来介绍怎么样把一个web应用打包成一个可执行文件（这里只介绍windows环境）

首先新建一个index.html文件，作为我们这个demo的入口页面，我们暂且就把这个页面当成一个完整的web应用吧。内容随便写点什么，比如：

项目结构如下：

html代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>NW</title>

    <link rel="stylesheet" href="../css/NWcss.css">

</head>

<body>

<div id="nw">这是一个测试div</div>

</body>

<script src="../js/NWjs.js"></script>

</html>

css代码：

#nw{

    width: 500px;

    height: 300px;

    border: solid 1px red;

}

js代码：

document.getElementById("nw").onclick=function () {

    alert("别点我！！！")

}

json代码：

{

  "main": "html/index.html", // 启动页面

  "name": "NW",

  "window": {

    "toolbar": false, // 是否显示工具栏（调试使用）

    "frame": true,   // 是否显示NW框架

    "width": 666,//应用页面的宽度

    "height": 450,//应用页面的高度

    "resizable": true  //可调整大小

  }

}

除了上述配置：

还有很多其他有用的属性可以配置具体的配置参数文档可看这里https://github.com/rogerwang/node-webkit/wiki/Manifest-format

项目在谷歌浏览器的运行效果：

该项目下所有的文件一起打包：注意，一定要在项目目录内部执行压缩

打包之后点击进去压缩包效果如下：

将该zip文件剪切到我们NW的安装目录：

将zip文件拖住放在nw.exe上面：

效果如下：

我们将zip文件后缀改为.nw效果也是也一样

打包成exe文件

首先打开windows的cmd,进入到NW的安装目录下，然后输入如下命令：

copy /b nw.exe+NW.nw app.exe

然后就会产生一个exe文件：

双击exe文件就可以运行我们的程序：

注意，此时的app.exe文件只能在该目录下运行，因为它需要依赖NW的环境

 但我们大多数人想的是给用户一个exe文件，用户就可以使用了，不用再附带一些其他文件。

嗯，所以我们还可以把app.exe跟其他的文件再打包一次，把上图中的所有文件变成一个可执行文件，用户只要得到这个文件，就能运行我们的应用了。

做这步我们需要一个软件叫Enigma Virtual Box，首先下载和安装这个软件，然后打开它。

然后在Enter Input File Name那里输入我们的app.exe的路径，在Enter Output File Name那里填写我们要把打包出来的可执行文件输出到哪里。最后是把除app.exe外的其它文件拖入到Files那里，遇到提示的话默认就可以了。

最后点击右下角的Process按钮，就大功告成了。

最后我们得到了一个 app_boxed.exe 的文件，只要把这个文件交给用户，用户就可以运行了。

node-webkit虽然方便，但有个很大的缺点是得到的可执行文件有点大，大家在可以在衡量利弊后决定使不使用。

当然node-webkit能做的并不是本文写的那么浅显，例如

  • 解除了浏览器 沙盒 限制，像 葫芦鸭 中用到的跨域，原本单凭前端是无法实现的。
  • 可以使用node.js，除了node.js本身的特性，意味着npm中那么多的扩展可以供你使用。
  • node-webkit还实现了本地化的API，例如菜单栏，系统的托盘图标支持，系统剪贴板等

2、node-webkit运行web应用，node-webkit把web应用打包成桌面应用的更多相关文章

  1. 用node-webkit把web应用打包成桌面应用

    node-webkit是一个Chromium和node.js上的结合体,通过它我们可以把建立在chrome浏览器和node.js上的web应用打包成桌面应用,而且还可以跨平台的哦.很显然比起传统的桌面 ...

  2. electron安装+运行+打包成桌面应用+打包成安装文件+开机自启动

    1.初始化node项目,生成package.json文件 npm init 2.安装electron,并保存为开发依赖项 npm install electron -D 3.根目录下新建index.j ...

  3. 使用Ant构建struts2 web工程，自动编译，打包成war

    c&c++语言通常使用make脚本来构建和管理自己的工程,同样java也有自己的构建工具(Ant),使用时需要写一个biuld.xml,有点类似c&c++里的makefile. 一.首 ...

  4. Node.js高级编程读书笔记 - 4 构建Web应用程序

    Outline 5 构建Web应用程序 5.1 构建和使用HTTP中间件 5.2 用Express.js创建Web应用程序 5.3 使用Socket.IO创建通用的实时Web应用程序 5 构建Web应 ...

  5. kubernetes:用label让pod在指定的node上运行(kubernetes1.18.3)

    一,为什么要为node指定label? 通常scheduler会把pod调度到所有可用的Node,有的情况下我们希望能把 Pod 部署到指定的 Node, 例如: 有的Node上配备了速度更快的SSD ...

  6. Sublime Text3 配置Node.js运行命令

    ­ 在Sublime Text中可以很容易配置新的编译运行命令,下面的截图是汉化版的中文菜单,英文菜单请直接对照. 首先需要在本地安装Node,默认的Node会加入到系统的环境变量,这样执行Node命 ...

  7. Node.js: What is the best "full stack web framework" (with scaffolding, MVC, ORM, etc.) based on Node.js / server-side JavaScript? - Quora

    Node.js: What is the best "full stack web framework" (with scaffolding, MVC, ORM, etc.) ba ...

  8. Node.js 全栈开发（一）——Web 开发技术演化

    这些年一直不断接触学习 Node 技术栈,个人的技术开发学习兴趣也越来越倾向 node 流.也许是由于英语的关系,也许是因为墙增加了学习国外一手资料的难度,加上现在流行的 web 开发技术并不太容易上 ...

  9. sudo 运行 npm或node时，出现找不到命令

    sudo 运行 npm或node时,出现找不到命令的情况,运行下面这些命令, sudo ln -s /usr/local/bin/node /usr/bin/node sudo ln -s /usr/ ...

随机推荐

  1. HBASE学习笔记(四)

    这两天把要前几天的知识点回顾一下,接下来我会用自己对知识点的理解来写一些东西 一.知识点回顾 1.hbase集群启动:$>start-hbase.sh ===>hbase-daemon.s ...

  2. javaScript运动框架之缓冲运动

    缓冲运动 逐渐变慢,最后停止 距离越远速度越大   速度由距离决定 速度=(目标值-当前值)/缩放系数 存在Bug 速度取整 跟随页面滚动的缓冲侧边栏 潜在问题:目标值不是整数时 缓冲运动的停止条件 ...

  3. 配置MySQL服务器使得外网可以连接

    https://blog.csdn.net/bird3014/article/details/78481104

  4. Redox OS 发布 0.5 版

    Redox OS 是一个几乎完全以 Rust 语言编写的通用操作系统及周围生态(例如文件系统.显示服务器及 Rust 版本的 libc).其遵循微内核架构,在一定程度上兼容于 POSIX. 该项目于日 ...

  5. MongoDB入门_shell基本操作

    使用shell客户端连接mongoDB数据库 [root@localhost mongodb_simple]# ./bin/mongo /admin mongoDB的简单基本操作 1. mongoDB ...

  6. [转载](转)ISE中ROM初始化文件（.coe）的建立

    原文地址:(转)ISE中ROM初始化文件(.coe)的建立作者:老徐 UltraEdit 对于ROM模块,主要是生成相应的.coe文件. 1.在Matlab中生成正余弦波形的浮点值,并量化为16bit ...

  7. MYSQL安装相关知识

    将mysql安装为winsow服务 1.执行命令: mysqld-nt.exe --install (安装到windows的服务) 或者是mysqld -install 2.执行命令: net sta ...

  8. Linux系统nmtui/nmcli绑定双网卡为team

    今天给大家带来图形化界面网络配置工具—nmtui的使用方法,可以省去敲命令的繁琐,较少误操作,结果更加直观. 小知识: nmtui:Network Manager Text User Interfac ...

  9. Mybatis的体系结构（转载）

    原文:http://blog.csdn.net/hupanfeng/article/details/9068003/ MyBatis的前身叫iBatis,本是apache的一个开源项目, 2010年这 ...

  10. 【HDU4276】The Ghost Blows Light

    题目大意:给定一棵有根树,1 号节点为根节点,点有点权,边有边权,初始给定一个价值,每经过一条边都会减少该价值,每经过一个点都会增加相应的答案贡献值,求如何在给定价值的情况下最大化答案贡献,并要求最后 ...