下载node-webkit

点击这里:

https://github.com/rogerwang/node-webkit

找到Downloads这一小节,然后下载对应平台的node-webkit预编译包。(为了介绍起来方便,本文后续内容全部针对windows平台,OSX和linux平台上的操作类似,就不做特意说明了。)

下载完之后解压,可以看到如下内容:

双击nw.exe直接运行,看到如下界面说明一切都ok,在你的机器上可以运行:

Hello nw

老规矩,先来Hello World!

建一个example1.html,内容如下:

<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Hello node-webkit!</h1>
We are using node.js <script>document.write(process.version)</script>.
</body>
</html>

在同一级目录下再建一个package.json,内容如下:

{
"name": "nw-demo",
"main": "example1.html"
}

好了,用你机器上的压缩工具,rar或者7z或者神马神马的,把这两个文件压缩成exampl1.zip,如下图所示:

        注意,用什么工具压缩无所谓,但是一定要压缩成ZIP格式。

把example1.zip拷贝到与nw.exe同级的目录下,如下图:

然后用鼠标把example1.zip拖动到nw.exe上运行(用命令行也可以,不过在windows下还是直接拖比较爽一点),效果如下图:

这样,第一个例子就完成了,然后你自己可以去玩儿了。

按照官方的搞法,example1.zip可改名成example1.nw,这样显得更加高大上一些。不过由于小僧的BIG一向比较低,私认为用.zip作为后缀也没啥不可以。

来点儿JS

第一个例子代码非常简单,你可以自己加点儿你最熟悉的JS代码,比如这样:

<!DOCTYPE html>
<html>
<head>
<title>Example2</title>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
</head>
<body>
<h1>Example2</h1>
<script>
alert("This is example2!");
</script>
</body>
</html>

显然,这里有很多HTML5的习惯写法,那当然是必须的对吧?因为webkit在google的调教之下早已成了HTML5的开路先锋了!

打包和分发

如上图,很显然,要想让我们的应用跑起来,以上这些dll和pak文件是少不了的(至于每个文件是用来干嘛的,请参见官方的描述文档)。

那么,对于我们做的example1这个简单的应用,怎么让我们的用户能运行它呢?当然,让我们的用户自己去下载node-webkit然后解压运行,这也算一种办法,这样的话我们只要把example1.zip文件扔给他就可以了。

不过这样总觉得有点儿奇怪,要是能把所有相关的内容都打包成一个独立的exe文件就好了,比如打包成example1.exe,这样用户拿到之后直接双击就可以运行,这样显然是极好的。

OK,let's go!

首先,我们要合并example1.zip和nw.exe,形成一个新文件,名为example1.exe,这一点我们通过windows的命令行下的copy命令可以实现:

copy /b nw.exe+example1.zip example1.exe

        注意,nw.exe必须放在+号前面。

这样就生成了一个名为example1.exe的文件,双击这个文件,看到的效果和第一个例子相同。很显然,这个example1.exe还是要依 赖那些dll文件才能运行,所以,这时候我们需要一款打包工具来帮助我们把这些example1.exe和dll文件都打包到一起,它就是Enigma Virtual Box,大家可以点击这里下载安装:

http://enigmaprotector.com/assets/files/enigmavb.exe

安装完成之后启动,看到如下界面:

打包过程截图(请按照图中的配置操作):

点击右下角的Process按钮开始打包,最终获得了一个名为example1_boxed.exe的文件。把这个文件拷贝到其它任意目录中双击,如果能顺利运行,说明打包成功!你可以把它分发给你的用户了!

官方的文档上还介绍了其它几种打包分发方式,不过看起来都不是很实用,有兴趣的参见这里:

https://github.com/rogerwang/node-webkit/wiki/How-to-package-and-distribute-your-apps

node-webkit 入门的更多相关文章

  1. Node.js 入门手册:那些最流行的 Web 开发框架

    这篇文章与大家分享最流行的 Node.js Web 开发框架.Node 是一个服务器端 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用程序,编 ...

  2. 【特别推荐】Node.js 入门教程和学习资源汇总

    这篇文章与大家分享一批很有用的 Node.js 入门教程和学习资源.Node 是一个服务器端的 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用 ...

  3. 让我们一起学习《Node.js入门》一书吧!

    Node.js入门 读完本书之后,你将完成一个完整的web应用,该应用允许用户浏览页面以及上传文件. 里面对一些知识的讲解,让你略窥Node.js的门径.最好一段代码一段代码的写下来,我的习惯是手里拿 ...

  4. Node.js入门实例程序

    在使用Node.js创建实际“Hello, World!”应用程序之前,让我们看看Node.js的应用程序的部分.Node.js应用程序由以下三个重要组成部分: 导入需要模块: 我们使用require ...

  5. Node.js 入门教程和学习资源汇总

    这篇文章与大家分享一批很有用的 Node.js 入门教程和学习资源.Node 是一个服务器端的 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用 ...

  6. Node.js 入门资料

    小毛驴的阿凡提的 Node.js 入门笔记 http://www.cnblogs.com/Afanty/category/1007304.html

  7. Node.js 入门 资源

    Node.js 入门 <快速搭建 Node.js 开发环境以及加速 npm> http://fengmk2.com/blog/2014/03/node-env-and-faster-npm ...

  8. 《Node.js入门》CentOS 6.5下Node.js Web开发环境搭建笔记

    近期想尝试一下英特尔的基于WebRTC协同通信开发套件,所以须要在本地搭建Node.js Web的开发測试环境. 这里讲的是CentOS 下的搭建方法.使用Windows的小伙伴请參考: <No ...

  9. 极简 Node.js 入门 - Node.js 是什么、性能有优势?

    极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...

  10. 极简 Node.js 入门 - 1.2 模块系统

    极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...

随机推荐

  1. 学习mybatis-3 step by step 篇二

    Mapper XML 文件 基本的*Mapper.xml文件配置就不熬述了具体可参考: http://www.mybatis.org/mybatis-3/zh/sqlmap-xml.html 1.sq ...

  2. Oracle数据库常见版本

    Oracle数据库常见版本 在Oracle数据库的发展中,数据库一直处于不断升级状态,有以下几个版本: Oracle 8,Oracle 8i:Oracle 8i表示Oracle正式向Internet上 ...

  3. LIBS+=

    ZC: “LIBS+=”是要结合“LIBPATH += ”一起使用的?类似下面的用法: ZC: “LIBS+=”指明lib文件的名称,“LIBPATH += ”指明lib文件的路径.最后还要把DLL文 ...

  4. tp5.0 composer命令插件

    1.单元测试composer require topthink/think-testing 1.* (5.0) composer require topthink/think-testing 5.1官 ...

  5. Jedis 之 初始<一>

    package xx.jedis; import java.util.Set; import redis.clients.jedis.Jedis; import redis.clients.jedis ...

  6. 只能输入float

    if (((int)e.KeyChar < 48 || (int)e.KeyChar > 57) && (int)e.KeyChar != 8 && (in ...

  7. Necklace CodeForces - 613C (构造)

    链接 大意: 给定n种珠子, 第i种有$a_i$个, 求将珠子穿成项链, 使得能使切开后的项链回文的切口尽量多 若有一种以上珠子为奇数, 显然不能为回文, 否则最大值一定是$gcd(a_1,a_2,. ...

  8. 线程同步,条件变量pthread_cond_wait

    与互斥锁不同,条件变量是用来等待而不是用来上锁的.条件变量用来自动阻塞一个线程,直到某特殊情况发生为止.条件变量使我们可以睡眠等待某种条件出现.条件变量是利用线程间共享的全局变量进行同步的一种机制,主 ...

  9. cnblogs插件jiathis

    博客园cnblogs增加分享插件 <!--jiathis button Begin--> <div id="ckepop"> <span class= ...

  10. Openwrt Udev Configure(3)

    1      Scope of Document This document describes how to write udev script, when enum usb device mayb ...