vue+hbuilder 打包成移動app


查看了很多網上寫的改來改去都在手機上運行不起來,運行起來又是白屏;最后放棄,自己結合文檔搞吧!

1.

項目目錄下的config文件夾里的index.js文件中,將build對象下的assetsPublicPath中的“/”,改為“./”后,打包生成的 dist 文件。

注釋:config文件夾里的index.js中有兩個assetsPublicPath,記住是改 build對象下的 assetsPublicPath

 

完了之后,打包, 執行npm run build之后生成dist文件夾 

 

2.

在新建一個獨立文件夾的項目 ,選擇 H5+app

 

 

 

 

 把新建H5+app里面不要的css,img,js,index文件先刪除掉,然后把vue打包生成的 dist 文件夾里面的 static文件復制到 H5+app里面

 

 

 

 

 

 

 

 

 

 

 

上圖中添加位置的代碼

"statusbar": { //應用可視區域到系統狀態欄下透明顯示效果
            "immersed": true
        },

 

 

 

 
        

解決打包成App后,單擊 手機返回鍵退出應用的bug。(可以直接把這段代碼放到你vue項目中,重新打包,再放回來,也可以直接修改這個index.html)

 

<script>

 document.addEventListener('plusready', function(a) { //等待plus ready后再調用5+ API:

                //// 在這里調用5+ API
             var first = null; plus.key.addEventListener('backbutton', function() { //監聽返回鍵 //首次按鍵,提示‘再按一次退出應用’ if (!first) { first = new Date().getTime(); //獲取第一次點擊的時間戳 // console.log('再按一次退出應用');//用自定義toast提示最好 // toast('雙擊返回鍵退出應用'); //調用自己寫的吐絲提示 函數 plus.nativeUI.toast("雙擊退出", {duration:'short'}); //通過H5+ API 調用Android 上的toast 提示框 setTimeout(function() { first = null; }, 1000); } else { if (new Date().getTime() - first < 1000) { //獲取第二次點擊的時間戳, 兩次之差 小於 1000ms 說明1s點擊了兩次, plus.runtime.quit(); //退出應用 } } }, false); }); </script>





免責聲明!

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



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