HBuilder打包App方法

HBuilder是DCloud（數字天堂）推出的一款支持HTML5的Web開發IDE。該軟件既能夠支持web代碼編寫，也能夠將已經編寫好的項目代碼打包爲手機APP。

HBuilder提供的打包有云端打包和本地打包兩種，雲端打包的特色是DCloud官方配置好了原生的打包環境，能夠把HTML等文件編譯爲原生安裝包。

 

1，下載HBuilder，註冊並登錄。首先打開「文件」-「新建」-「移動APP」，輸入「應用名稱」，「位置」能夠根據須要本身選擇便可，「選擇模板」建議選擇空模板；

2，新建完成後， 在項目管理器會顯示新建的項目目錄，其中css，img，js和index.html這幾個文件可刪可改可替換。

unpackage文件夾是放置app圖標和啓動界面的圖片。

manifest.json文件是移動App的配置文件，用於指定應用的顯示名稱、圖標、應用入口文件地址及須要使用的設備權限等信息，用戶可經過HBuilder的可視化界面視圖或者源碼視圖來配置移動App的信息。

3，若是刪除了css，img，js文件夾和index.html文件，就把其餘本身的項目文件對應複製到文件夾中，注意html文件中的引用路徑須要保持正確。

以下圖本身拷貝的項目：

 

4， 文件複製完成後，刷新更新下，雙擊打開manifest.json文件來配置App。

appid：點擊雲端獲取。版本號：根據須要來編輯。頁面入口：默認是index.html，根據本身項目須要，更改APP的啓動頁面。應用描述：本身隨便填。應用是否全屏顯示：勾上就全屏顯示。

5，圖標配置：點擊頁面下方的圖標配置，配置APP顯示圖標。

1)點擊"+"號的正方形方框，選擇圖標素材的路徑找到圖標素材，再點擊" 自動生成全部圖標並替換"按鈕，完成圖標生成和替換。

2),生成的圖標自動在unpackage文件夾下

6，啓動圖片（splash）配置，點擊切換到啓動圖片配置

1)，啓動選項：默認

2)，啓動圖片設置，根據本身須要是Android仍是iOS平臺，再根據不一樣設備對應作出啓動圖片

3），在unpackage→res文件下新建個文件命名"splash"，把作好的啓動圖片放到這個文件裏面。

4），在啓動圖片設置裏點擊"選擇"，找到剛放進來的啓動圖片

7，SDK配置：有須要就配置，沒有就默認就行。

8，模塊權限配置：有須要就配置，沒有就默認就行。

9，頁面引用關係：

首先點擊「掃描代碼」，再點擊左邊index.html文件

該功能是什麼意思：點擊左側html文件，右側會顯示不一樣的文件，圖片等。能夠表示左側html文件加載時所須要的資源。

10，代碼視圖：在代碼視圖裏查看設置是否正確，肯定後ctrl+s保存好。

11，設置好配置選項，正式進入打包階段

HBuilder裏點："發行"-"發行爲原生安裝包"開始打包

這裏介紹一下iOS打包

1），這裏若是選擇越獄包就不須要蘋果證書，一路默認設置就能夠打包成功，可是打包的App只能安裝在越獄過的手機，沒越獄安裝不了。

2），若是使用蘋果證書，這裏推薦一個申請iOS證書的工具 Appuploader。免蘋果付費開發者帳號，直接使用普通蘋果id，就能使用Appuploader申請ios測試證書，打包ipa安裝到非越獄設備。

工具的安裝網址：http://www.applicationloader.net/blog/zh/72.html

免開發者帳號申請iOS證書教程：http://www.applicationloader.net/blog/zh/1073.html

 

12，提交成功後點擊肯定，就能夠查看App打包狀態

等打包成功，就能夠點手動下載，經過第三方工具 蘋果助手安裝到ipad上了。

13，調試和安裝模擬器

若是你須要在電腦本機進行調試那就須要安裝模擬器，請參考http://ask.dcloud.net.cn/article/151如何安裝配置手機模擬器，或者在HBuilder裏→→運行→→手機運行→→如何安裝配置手機模擬器進入查看。

若是須要安裝到手機進行真機調試，把手機用數據線鏈接到電腦，而後從新啓動HBuilder→→運行→→手機運行→→鏈接上真機。