使用HBuilderX實現打包vue項目成app


一、准備開發工具

開發工具:HBuilderX

官網地址:http://www.dcloud.io

(標准版需要自己安裝插件,app開發版已經把app開發常用的插件安裝好了,開箱即用,建議使用開發版)

二、打包生成一個vue項目

就拿手頭上一個vue項目進行打包,vue項目預覽如下:

打包生成的項目結構:

三、創建HBuilderapp項目

(請先注冊HBuilde賬號並登錄,打包的時候需要登錄,並獲取應用識別AppID

創建完后會看到以下結構:

其中cssimgjs文件夾換成打包后的staticindex.html換成打包后的index.html

Unpackage是用來放置app圖標等app文件的,index.htmlapp入口,manifest.json是用來打包成app的配置文件。

替換完后,變成以下目錄結構:

四、配置manifest.json

點擊manifest.json會打開配置頁面。

1、基礎配置:

①:應用識別AppID:雲端獲取,需要注冊並登錄

②:應用名稱、版本、版本號等設置按說明填寫即可

2、圖標配置:設置app圖標,上傳完圖片后,點擊自動生成所有圖標並替換,如下:

3、啟動圖配置:

不顯示等待雪花

設置安卓啟動圖片

4、SDK配置:根據項目使用情況填寫

5、模塊權限配置:根據項目使用情況填寫

6、源碼視圖:略

五、進行打包

以上配置完成后,就可以進行打包App了。點擊發行,選擇原生App-雲打包,會彈出雲打包彈框:

1、暫時只打包安卓,所以只勾選安卓

2、如果沒有自有證書,就選擇使用DCloud公用證書

3、不勾選廣告聯盟和換量聯盟

如下:

 

點擊打包即可。

提交完后,留意HBuilderX控制台信息

點擊下載鏈接下載安裝包就可以了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM