PHP开发工程师@温州。博客关于:技术、生活、读书、互联网。

node-webkit:用JS开发跨平台的桌面应用

node-webkit是一个基于chromium和node.js实现的应用程序运行时环境,开发人员可运行通过HTML(5)、CSS(3)、Javascript来编写的本地应用程序。

项目地址: https://github.com/rogerwang/node-webkit

文档: https://github.com/rogerwang/node-webkit/wiki

开源协议:MIT


特点:

使用web技术开发,html5、css3、js、webGL。

在网页中使用node.js。

跨平台运行,兼容linux、mac、windows。


安装node-webkit(这里以mac os为例)

1.去github下载mac版的node-webkit  https://github.com/rogerwang/node-webkit

2.解压之后修改 ~/.bash_profile ,设置node-webkit执行程序的别名为nw(本人解压在/usr目录)。

alias nw="/usr/node-webkit-v0.7.5/node-webkit.app/Contents/MacOS/node-webkit"

3.使别名立即生效

source ~/.bash_profile 

4. 在控制台输入nw测试是否安装成功。


使用node-webkit进行开发

 一个基本的node-webkit项目一般由3部分组成:主窗口文件index.html、配置文件package.json、其他一些资源及类库。


1. 新建一个项目文件夹test1/

2. 创建主窗口文件test1/index.html

          

<!DOCTYPE html>
<html >
<head>
    <meta charset="utf-8">
    <title>Hello world</title>
</head>
<body>
    <h1>hello node.js</h1>
</body>
</html>

3. 创建test1/package.json

 {
     "main" : "index.html",
      "name" : "test",
      "window" : {
            "toolbar" : false
       }

}

4.  在控制台执行 nw test1 就能运行该应用程序。


打包应用程序

目前我们运行一个应用程序需要通过命令行来执行。

但在实际环境中我们需要将应用打包成.app(mac)或.exe(windows)文件以方便用户的使用。

mac电脑上打包很简单,只需要将我们的项目压缩成xx.nw 。在将xx.nw复制到node-webkit.app/Contents/Resources目录下。node-webkit.app就是你的应用程序了,然后改名字如 hello.app 。


其他:

包括windows下如何打包、如何修改图标、如何使用node.js的模块等请看官方文档,这里就不多说了。


最后,让我们用node-webkit开发一款mac版的超级马里奥游戏。

(好吧~我承认我吹牛逼的~~)

在github下载马里奥的源码 https://github.com/Diogenesthecynic/FullScreenMario

打包一下,完成。





评论 ( 2 )
热度 ( 2 )

© yuankeqiang | Powered by LOFTER