事先准備,開發完成的web app項目(也可以利用vue-cli腳手架構建vue模板項目),npm run dev可以正常預覽的項目
1,將項目目錄下config文件內index.js中assetsPublicPath修改為 assetsPublicPath: './'
2,執行npm run build之后生成dist文件夾
3,打開HBuilder,文件->打開目錄,如下圖
選擇剛才生成的dist目錄,輸入項目名稱,點擊完成
附HBuilder下載地址:http://www.dcloud.io/
3,此時會看到HBuilder項目下多了一個W標識(表示web項目)的myApp項目,
右鍵菜單選擇‘轉換成移動‘轉換成移動App’,然后‘myApp’前面的標識就變成了‘A’,至此就已經轉換成移動app了,
隨后就可以利用HBuilder連接真機運行
或者發行成為原生app
注意:如果真機運行或模擬器運行報如下錯誤
Uncaught Error: [vuex] vuex requires a Promise polyfill in this browser
以下為以android apk為例的發行為原生app的步驟
1,點擊發行,這里發布測試apk選擇使用DCloud公用證書,點擊‘打包’
2,正在制作安裝包,制作完成,手動下載
3,將下載的apk安裝到android的手機看效果,以下是放到模擬器中的效果