說明:
當前有一個vue項目,需要使用cordova進行打包
環境條件:
1 jdk-即Java運行環境
這個很簡單,百度一下就行,學過Java的話都有安裝過jdk
檢查電腦是否安裝了jdk:win+R->輸入cmd->回車進入黑窗口,輸入javac->如果出現關於javac的幫助信息則表示已安裝
2 安裝nodejs環境
相信一般要打包vue項目肯定開始也是裝了nodejs了
查看是否安裝了nodejs:node -v(如果出現了版本號則表示安裝了)
3 然後需要安裝android SDK
3.1 首先需要下載android SDK Tools(別下錯了)
這裏提供一個下載地址:http://www.androiddevtools.cn/ 進去之後搜索SDK Tools,我下載的是這個壓縮包版的
下載完之後解壓這個壓縮包,解壓後如下:
雙擊打開SDK Manager應用程序,打開後需要下載一切東西如下:
1 Tools:我這裏選了這3個
2 Android API:這裏有很多版本的,我選了最新的(後來因爲打包時報SDK錯誤,按照提示我又安裝了API 28中的 SDK Platform)
3 最後的Extras:勾選了這2個
這裏需要提一下,下載的時候可能會比較慢,按照網上查找的資料,很多都說可以替換一下地址,
左上角的Tools->Options中的server和port內容,但是首先:網上發的有好幾個地址都無法訪問了,有個可以訪問,
但我改了之後重新打開SDK Manager,獲取不到內容了,就只剩下下面這樣了:所以我這裏後來刪掉了options的配置,
使用默認的下載了,雖然也等了一會,也不算太久,可以正常下載下來,下載完之後點擊close即可
下載好之後,需要給SDK配置環境變量,複製SDK的安裝地址,添加到path下即可
此電腦右鍵->屬性->高級系統設置->環境變量->系統變量的Path,
選擇編輯->新建->將剛剛複製的地址+tools和platform-tools放到這裏
(我這裏是添加了一個變量的形式,不用這個也行)->確定
最後,查看是否安裝成功:輸入:android -h
到這裏,android SDK的安裝也就結束了
4 安裝gradle(不太確定是不是要安裝,我這裏是安裝了的)
這裏可以直接看下這篇博客:https://blog.csdn.net/yao_94/article/details/81211528
打包
5 到這裏環境其實已經差不多搭好了,接下來就可以準備打包了
5.1 安裝cordova:如果沒有安裝cordova需要先安裝cordova:npm install -g cordova
5.2 選擇一個目錄,創建一個cordova項目:cordova create hello(項目名) com.pink.puck client(安裝之後app的名字)
5.3 cd到項目目錄下(www同級目錄),添加平臺:cordova platform add android
5.4 如果是vue-cli3創建的項目,很多文件是沒有的,比如config文件夾沒有,自然也就沒有裏面的index.js
所以cli3則需要在vue項目下(即src同級目錄)新建一個vue.config.js文件,在裏面配置:
module.exports = {
publicPath: '',
}
執行npm run build進行項目構建,構建成功之後會生成一個dist目錄,在scr同級,將dist目錄下的東西都複製到之前創建的
cordova項目下的www目錄下,覆蓋www已有的文件(可以先刪掉www目錄下的內容再粘貼進去)
注:如果vue.config.js中配置了這個,則生成到的目錄名就是bibibox-wb,然後下面會有一個asserts目錄,
js和css都在這個目錄下,沒有assertDir的話則js和css直接在bibibox-wb目錄下
上面說的是如果是cli3創建的vue項目,如果是cli2創建的話,則會有一個config目錄,下面有一個index.js文件,
修改裏面的build當中的內容即可,不用自己新建文件了,如下:原本這裏是"/",把這裏改成""即可,
後面構建的話也生成生成dist目錄,同樣在src同級目錄下,
同上執行npm run build將dist目錄下的內容複製到cordova的www下
5.5 打包
進入到cordova項目目錄,執行cordova build android,打包成功如下,並且會打印打的apk包在哪個位置
這裏說明一下,最終這裏是app-debug.apk,這個名字只是這個文件的名字,我們可以自己隨便改,
到時候安裝之後app的名字還是最開始創建cordovar項目時那裏指定的,這個項目安裝之後的名字就是client
到這裏打包已經完成了,將.apk的包安裝到安卓手機上就可以了,安裝之後打開運行看下是不是OK的就行了。