采用web技術(shù)開發(fā)PC應(yīng)用

   web應(yīng)用相較于原生應(yīng)用，在代碼開發(fā)調(diào)試時(shí)的便利就不多做解釋了。這里我們直入主題，今天我們要學(xué)習(xí)的是采用node-webkit來開發(fā)桌面應(yīng)用。顧名思義，node-webkit是由node和webkit構(gòu)成。我們可以直接在頁(yè)面上采用node的各種模塊，同時(shí)也可以用webkit的方式調(diào)試網(wǎng)頁(yè)。

下面我們就來看怎么開發(fā)簡(jiǎn)單的桌面應(yīng)用：

1、資源下載

node-webkit源碼地址：https://github.com/rogerwang/node-webkit

我要說的是windows下的開發(fā)，所以我們點(diǎn)擊如下圖的win32鏈接

如圖所示，它也可以開發(fā)Linux和Mac下的web應(yīng)用。

下載完后打開node-webkit-v0.7.1-win-ia32，雙擊nw.exe,我們打開了一個(gè)類似瀏覽器的東西如下：

沒錯(cuò)，它不只是長(zhǎng)得像瀏覽器而已，它真的有瀏覽器功能，它是基于webkit的，所以功能和chrome很相似，我們可以隨便輸入個(gè)網(wǎng)址，點(diǎn)擊回車就能訪問。

它還有類似chrome的調(diào)試功能，點(diǎn)擊地址欄右邊三條橫線的按鈕就能出現(xiàn)調(diào)試頁(yè)面。

2、web工程建立

接入正題，如何建立web工程，最簡(jiǎn)單的web工程只需要兩個(gè)文件，一個(gè)配置文件package.json和一個(gè)主頁(yè)面index.html。

最簡(jiǎn)單的package.json格式如下：

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

一個(gè)項(xiàng)目名字name，一個(gè)主頁(yè)面main。

配置文件package.json格式可參考 Mainfest format

3、打包運(yùn)行web應(yīng)用

首先，我們將我們的配置文件和package.json和web相關(guān)打包為app.zip

然后修改app.zip后綴名為nw

然后就要運(yùn)行了,開啟cmd，cd到nw.exe的目錄下：

nw.exe app.nw

也可以將app打包為exe文件

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

不過app.exe只能在nw.exe所在目錄下運(yùn)行（不知有沒有高人知道怎么破）

官網(wǎng)說必須要和nw.pak放在一起，但我嘗試下還是不行。

4、node_modules的應(yīng)用

(1) node自帶的模塊可以直接require('moduleName')使用

(2) 不是node自帶的我們可以在zip包根目錄中新一個(gè)node_modules文件夾，然后將npm下載的模塊放入此文件夾，依舊是require('moduleName')調(diào)用。

騷年們，發(fā)揮想象力來創(chuàng)造web app吧！