用HBuilderX 打包 vue 項目 爲 App 的步驟

首先打包你的 vue 項目 生成 dist 文件夾，教程請移步  http://www.javashuo.com/article/p-dptlqpgm-nx.html

看完上面的教程，請確保 你是 將：

項目目錄下的config文件夾裏的index.js文件中,將build對象下的assetsPublicPath中的「/」，改成「./」後，打包生成的 dist 文件。（不改的話打開的頁面是空白的 路徑不對）

開始使用 HBuiderX 打包。 （工具下載地址：http://www.dcloud.io/）

2.選中H5+App 填入項目名稱  項目地址

 這是我vue 項目打包後的dist 文件

 

 設置沉浸狀態欄：（什麼是沉浸狀態欄和設置方法 請移步： http://ask.dcloud.net.cn/article/32  地址裏的  http://ask.dcloud.net.cn/article/1150）

 上圖中添加位置的代碼：

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

能夠看看加了沉浸式和不加的區別: 一個是不加的  另外一個是加了沉浸式 

                                       

上圖中的代碼：

<script type="text/javascript">
    //以下代碼主要是解決, 打包後的app點擊返回鍵直接退出的bug.  
    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>

上面這段代碼：我參考的文章和文檔連接：

https://blog.csdn.net/qq_25252769/article/details/76913083（解決Hbuilder打包的app返回鍵直接退出 ）

這個是 H5+ API 的（經過js調取Android等平臺的原生方法）學習連接：http://ask.dcloud.net.cn/docs/

 

注：

安卓apk 簽名生成 能夠參考： https://www.jianshu.com/p/f193638fbfc2 (HBuilder 開發，Android自有證書生成及打包)