在項目開發(fā)中，需要將h6頁面打包成app，這個時候我們可以使用cordova來打包。在官方文檔中，我們可以了解到創(chuàng)建一個app十分簡單，你的電腦上有nodejs就行，我們可以跟著官方文檔一步一步來，添加安卓平臺和ios平臺。整個項目結構搭建完畢后，我們可以將我們需要打包的webapp頁面全部塞到這個項目結構中。接下來就是麻煩的地方了，如何進行平臺開發(fā)，也就是如何將我們的項目打包成一個可安裝的文件。

創(chuàng)新互聯(lián)專注于眉山網(wǎng)站建設服務及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供眉山營銷型網(wǎng)站建設，眉山網(wǎng)站制作、眉山網(wǎng)頁設計、眉山網(wǎng)站官網(wǎng)定制、小程序定制開發(fā)服務，打造眉山網(wǎng)絡公司原創(chuàng)品牌,更為您提供眉山網(wǎng)站排名全網(wǎng)營銷落地服務。

一：設置環(huán)境變量：

1.設置JAVA_HOME環(huán)境變量，指定為JDK安裝路徑

2.設置ANDROID_HOME環(huán)境變量，指定為Android SDK安裝路徑

3.同時也要添加Android SDK的tools和platform-tools目錄到你的PATH

這里需要注意的是設置ANDROID_HOME環(huán)境變量，我們可以將android studio安裝到我們的電腦中，在安裝過程中android studio會自動將Android SDK安裝到我們的電腦里，這個時候記住這個地址就行了，如圖(下面那一行的路徑就是Android SDK)：

二：報這種錯誤的時候：Error:Minimum supported Gradle version is xxxx.  Current version is xxxx.

當時我在打包的時候報這鐘錯誤，在網(wǎng)上查到了原因，是因為android studio更新了Gradle的版本，這個時候解決的步驟如下：

1：打開android studio，找到setting，搜索gradle,如圖進行設置（具體路徑各異）：

三：Windows cordova build Error: Could not find gradle wrapper within Android SDK. Might need to update

解決辦法：

1. 下載 Android SDK tools package（https://dl.google.com/android/repository/tools_r25.2.3-windows.zip）
2. 進入 C:\Users\\AppData\Local\Android\sdk目錄
3. 備份tools目錄
4. 將壓縮包中的tools目錄解壓到這個目錄下
5. 進入工程目錄，再次運行 “cordova build android”。

四：安裝cordova-plugin-splashscreen報錯：

這個時候可能的原因是你已經(jīng)打包過apk文件了，你需要將apk文件刪除，然后再安裝。

五：打包vue項目時遇到的問題

 1：使用npm run build打包到哪？

如圖,Qianne是我vue項目的名稱，我在這個文件夾打開了dos窗口，然后創(chuàng)建一個app框架，名為myApp1。然后我將config里index.js中修改：

index: path.resolve(__dirname, '../myApp1/www/index.html'),
 assetsRoot: path.resolve(__dirname, '../myApp1/www'),
 assetsSubDirectory: 'static',
 assetsPublicPath: './',

這里的路徑直接指向了myApp1下www文件夾。然后我們在vue項目中運行npm run build。這個時候我們就把打包后的文件直接放在了myApp1下www文件夾。此時我們還要將

cordova.js和cordova_plugins.js文件放進www文件夾中，與index.html同級。（記住此時會覆蓋index.html，我們要將index.html中引用cordova.js的那句代碼復制到打包后的index.html中）。

2:直接打開打包后的index.html，路由居然沒作用？

我的解決辦法：

找到vue項目中的main.js,將其中路由的代碼的mode改為“hash”，我之前是“history”所以路由一直沒用

const router = new VueRouter({

 mode: 'hash',

 routes

}) 

之后我們再打包一次，如果打包后的index.html打開后路由正常，那么恭喜你。這個時候我們在myApp1下進入dos窗口，輸入cordova build android，打包成apk文件。

六:app的logo啟動頁面應該放在哪里？

在項目結構中, 我們需要安裝splashscreen插件：

cordova plugin add cordova-plugin-splashscreen 

我們在config.xml中插入以下代碼：

同樣的，我們要在res文件夾下的對應文件夾中放入相應的logo或者圖片.

以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。