將Vue移動端項目打包成手機app---HBuilder

 

 

 

將移動端頁面打包成app

一、使用 HBuilder 直接編譯打包

     點擊左上角 文件》打開目錄》選擇目錄  選擇用Webpack打包好的dist文件目錄

 

因爲我添加到項目了，因此會顯示該項目名稱已存在，請從新輸入。

二、接着點擊完成，就能夠在目錄中看到dist

 

這裏dist前面的標誌應該是W  因爲我轉換過一次，就會顯示A 

三、鼠標右鍵點擊dist目錄，選擇`轉換成移動App`，成功以後目錄前面的圖標就會變成 A 同時會多出一個 `manifest.json文件`

四、雙擊`manifest.json` 是可視化界面

五、填寫基本信息 選中橫豎屏等信息

 

能夠選擇圖片等一系列信息

點擊代碼視圖就能夠看到代碼界面了。

六、開始打包，咱們點擊HBuilder頭部導航欄的發行》雲打包-打原生安裝包

這裏你能夠選擇ios或者android安裝包

七、若是是安卓安裝包則能夠直接選擇完以後開始打包

 

點擊打包完了以後，能夠查看打包狀態，打包完畢能夠點擊下載安裝包，就能夠安裝到本身手機上啦。這裏推薦用愛思助手，不是廣告，由於本身用iTools的時候 出現了安裝不成功的問題，暫時沒解決 可是用愛思助手就解決了。

八、如今咱們來看打包成ios的

很明顯，這裏打包ios安裝包是須要 ios開發者證書==》AppID、私鑰密碼、profile文件、私鑰證書。

若是你有ios開發者帳號，這是須要$99 購買一年的 美刀。購買了以後，能夠登陸以後獲取相應的證書以及密鑰。

這裏我重點講一下，如何使用打包ios測試的，沒有ios開發者帳號沒有證書和私鑰證書怎麼辦。

可使用 

免費蘋果帳號（apple id）申請ios證書p12真機調試

詳情見下一篇分析。