cordova+vue 項目打包成Android（apk）應用

如今使用vue開發的項目愈來愈多，使用vue開發的移動端打包就成了最大的問題。
如今前端打包方案有好多種，可是綜合來講，我比較喜歡用cordova來進行Android和ios的打包，配置完成以後，每次只須要一條命令就能夠完成打包。

1.安裝cordova
這一步的前提是已經完成安裝node和npm,若是沒有安裝的話，請先完成node和npm的安裝。
node安裝：直接進入官網https://nodejs.org/zh-cn/，下載最新版本安裝。安裝以後在命令行中使用」node -v」 檢查安裝是否成功。
npm安裝：因爲新版的nodejs已經集成了npm，因此node安裝時npm也一併安裝好了。一樣能夠經過輸入 「npm -v」 來測試是否成功安裝。
使用命令

npm install -g cordova

來全局安裝cordova，安裝成功以後，使用命令

cordova -v

來檢查是否正確安裝，正確安裝會顯示安裝的cordova版本號。

2.新建cordova項目
執行命令

cordova create myApp1 org.apache.cordova.myApp myApp2
cd myApp1

來新建cordova項目，初始化cordova開發環境。
其中：

myApp1：cordova目錄名
org.apache.cordova.myApp： 包名
myApp2： 項目名（在config.xml中查看）

生成的cordova文件中

config.xml -包含應用相關信息，使用到的插件以及面向的平臺

platforms – 包含應用運行平臺如 Android 和 iOS 上對應的 Cordova 庫

plugins – 包含應用所需插件的 Cordova 庫，使得應用可以訪問例如照相機和電池狀態相關的事項。

www – 包含應用源代碼，例如 HTML, JavaScript 和 CSS 文件

hooks – 包含爲個性化應用編譯系統所需的腳本

使用命令

cordova platform add android

來生成Android平臺的cordova庫，這時platforms文件夾中會生成一個android文件夾。
到這裏，cordova項目就已經建好了。

3.新建vue項目

爲了方便，不須要每次編譯都拷貝文件，可直接在cordova項目根目錄中建立vue項目。

首先全局安裝Vue-cli腳手架。

npm install -g vue
npm install -g vue-cli

而後使用命令

vue init webpack MyApp

新建vue項目。完成以後的目錄以下所示。

到這裏，vue項目即構建完成。

4.修改文件
修改Vue項目config/index.js文件.

 

5.編譯vue項目
在vue項目根目錄執行命令

npm run build

便可編譯vue項目自動到cordova主目錄下的www文件夾中。

6.調試打包apk軟件
調試打包軟件以前，首先檢查androidsdk是否正確安裝，執行命令

cordova requirements

便可看到當前環境中sdk安裝狀況。顯示以下即表示環境正確安裝。（只需確認正確安裝便可，不需每次都去檢查）

在cordova主目錄下使用命令

cordova run android

來聯調android軟件（需鏈接真機或者模擬器）。
執行命令

cordova build android

來打包成apk軟件（…/cordovaApp/platforms/android/app/build/outputs/apk/debug/app-debug.apk）。

7.APK簽名
APK都必須通過數字簽名後才能安裝到設備上，簽名須要對應的證書（keystore），大部分狀況下 APK 都採用的自簽名證書，就是本身生成證書而後給應用簽名。
數字簽名證書是給APK打包所必需的文件，因此咱們先要把數字簽名證書生成。
在命令提示符下輸入

keytool -genkey -v -keystore D:\mytest.keystore -alias mytest -keyalg RSA -validity 20000

　　*-keystore D:/mytest.keystore表示生成的證書及其存放路徑，若是直接寫文件名則默認生成在用戶當前目錄下；
　　-alias mytest 表示證書的別名是mytest,不寫這一項的話證書名字默認是mykey；
　　-keyalg RSA 表示採用的RSA算法；
　　-validity 20000表示證書的有效期是20000天。*

根據指令輸入密鑰庫口令，是不可見的。依次輸入下面的問題。最後到【否】那裏時輸入y
再輸入密鑰口令（能夠與密鑰庫口令相同），若是相同，直接回車，記住這兩個口令，後面簽名會使用到。
這時便會生成一個文件mytest.keystore，就是咱們須要的簽名文件。

生成帶簽名的apk有兩種方式，一種先生成未簽名debug版本，再加上數字簽名證書而後生成帶簽名的APK。另一種就是直接一條命令生成帶簽名的APK。
（1）先生成未簽名的debug版本的apk
首先執行命令

cordova build android --release

　就會生成一個app-release-unsigned.apk。把數字簽名放到生成的未簽名的apk所在的目錄下，輸入如下命令：

jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore mytest.keystore app-release-unsigned.apk mytest

這時的apk就會是一個已經簽名的apk了，修改一下名字便可直接放到設備上安裝。

(2)直接生成帶簽名的apk
有了數字簽名以後,數字簽名須要放在cordova項目根目錄下或者能夠修改下面指令的keystore裏的路徑能夠直接在cordova build中指定全部參數來快速打包，這會直接生成一個android-release.apk(已是帶簽名的了)

cordova build android --release --keystore="mytest.keystore" --alias=mytest --storePassword=testing --password=testing1

keystore 後面是數字簽名證書， –alias 後面是別名 storePassword 後面是密鑰庫口令 password 後面是密鑰口令

注意：命令中口令要替換成本身的，就是生成簽名是須要記住的那兩個口令

但每次打包輸入命令行參數是很重複的，Cordova 容許咱們創建一個 build.json 配置文件來簡化操做。在cordova根目錄新建文本文檔，更名爲build.json。

 

文件內容以下

{
　　」android」: {
　　　　」release」: {
　　　　　　」keystore」: 「mytest.keystore」,
　　　　　　」alias」: 「mytest」,
　　　　　　」storePassword」: 「testing」,
　　　　　　」password」: 「testing2」
　　　　　　}　　
　　　　}
　　}

　　

但下面的兩個密碼建議不要寫到裏面去，能夠去掉而後手動輸入。

直接使用

cordova build –release

就能夠生成帶簽名的apk了

注意：cordova build後面沒有android

若是這篇文章對你的工做或者學習有幫助的話，請收藏或點個贊。若是對其中有什麼不明白的或者報錯，能夠留言或者加QQ羣140455228交流。