VUE項目用hbuilder 打包為手機APP


一、測試項目是否可以正確運行    指令:npm run dev

首先我們先建立一個vue的項目,本人用的是vue-cli隨便建立的,然后運行項目

不必非得是像我這樣的,這一步的目的只是測試一下咱們的vue項目是否可以運行

 

二、修改路徑(assetsPublicPath: './')

打開我們config中的js文件,修改assetsPublicPath的路徑為"./"(下圖的右下角位置)


 

三、打包文件  指令:npm run build

打包后會生成dist文件

 

四、把dist文件變成app模式

在HBuilder中點擊文件,打開目錄,找到我們項目中的dist文件,確定。

然后我們會看到這樣的帶着 W 的文件


 

五、轉換APP

右鍵dist,點擊轉換成App(T)


 

六、manifest.json里面配置APP名字及APP圖標

我們在上一步會生成一個manifest.json文件,打開它,我們在這里操作

app名字:就是應用名稱(這里我寫的是思源000)


app圖標:現在下面點擊圖標配置,然后選擇圖片放上去(圖片只能為PNG格式,通過手動改后綴是不可以的),在這里我選擇的是聖誕小人的圖標


 

七、生成apk

1.點擊發行,發行為原生安裝包


2.點擊使用DCloud公用證書,點擊打包


好了打包成apk文件了,把這個安裝到手機上咱們就可以用了,嘿嘿!!!

 

 


免責聲明!

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



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