1.首先項目開發(fā)完之后 （我使用的是vue-cli 3.*版本）
image.png
第一步: 在項目文件夾下創(chuàng)建一個 vue.config.js
module.exports = {
publicPath: “./”, // 打包 配置這個可以先本地查看下 效果
productionSourceMap: false // 調(diào)試文件的功能關(guān)閉 能加快打包
};
第二步: 運行命令行 npm run build
image.png
第三步：項目文件夾下生成一個 dist文件夾 下面有這些文件 然后打開index.html 本地預(yù)覽可以
image.png
第四步：然后打開huilderX 創(chuàng)建一個 5+App項目
image.png
第五步: 創(chuàng)建完成之后 打開文件目錄
image.png
第六步:把你vue項目打包的文件 把這里的 相同的文件 覆蓋掉
主要是 css img js 文件夾 和index.html文件 完成之后 進入項目 打開manifest.json 文件 進行基礎(chǔ)的配置 包括版本 名稱 圖標 sdk等配置
將如下選中文件刪除
image.png
然后將vueKK項目里的dist下的文件復(fù)制到h5Demo項目中
image.png
第七步：在h5Demo項目中點擊manifest.json文件
image.png
第八步：進入hBuilderX 右擊項目->發(fā)行->原生app云打包
如有有自己的開發(fā)id就用自己的 沒有就用dcloud的公有證書
點擊打包 等到打包完成 他會返回一個app的下載地址 你下載下來
是一個apk文件 然后傳到手機上就可以 點擊安裝了
安裝完之后 測試 可以 表示打包成功了
本人也是前端 小白 期待大佬的指點 自己一個人摸搜也是走了不少彎路
image.png
第九步：apk打包成功
