vue+cordova 打包項目—排坑之旅

第一次使用cordova過程,遇到了無數個坑,記錄一下吧!html

1、準備工做前端

若是你已是一個前端開發人員,那麼相信你的開發電腦已經安裝了jdk,和node相關的環境了,而後的而後就是忽略準備工做中的第一個環節了不過確認一下是否安裝過gradle。vue

然而若是你是一個剛入行的小白,那麼我只能給你奉上相關的下載地址了,而後自行安裝,安裝教程網上一推的;java

1.jdk,node,gradle環境安裝node

地址1node下載:https://nodejs.org/en/download/android

地址2:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html(jdk建議1.8版本的)npm

地址3:http://services.gradle.org/distributions/網絡

而後就是配置相關的JAVA_HOME環境變量了,網上教程不少,本文不在複製粘貼了。安裝後打開cmd,而後查看是否安裝和配置成功。oracle

2.經過npm install -g cordova 安裝cordova,若是網絡不給力,就用npm config --global set registry http://registry.cnpmjs.org吧。gradle

3.android  sdk 安裝

 

直接下載android studio能夠解決 ;以後的不少麻煩,後面會遇到再寫,不過下載android studio也能夠省好多事

 

下載地址:https://developer.android.google.cn/studio/index.html 

這裏囉嗦一下它的安裝過程(畢竟本人在這遇到了一點小麻煩),直接下一步就能夠,也能夠自定義目錄;(文件名中不能有中文,不然會報)

必定要記住下面的安裝位置,環境變量ANDROID_HOME的值就是下面的地址;

一切就緒以後,你覺得全部環境都會好,那麼你就想錯了,最重要的還沒到呢

你可Cordova requriements:查看cordova環境是否正確,這時候你就會發現 andriod target:not installed;

 

不要急,打開你剛安裝好的android studio ;點擊右上角的sdk manager,找到andriod sdk ,下載你須要的東東啦;

安裝完這個以後,你能夠在看看cordova requirements 。

2、開始工做(附上andriod)

1.cordova create hello com.example.hello helloworld

2.cd hello

3.cordova plarform add android 此時會出現下面的問題,我查資料說是適配問題,不過安裝一下插件就解決了cordova plugin add cordova-plugin-whitelist

4.將vue文件打包(npm run build),找到dist文件,拷到你如今項目的www目錄下(將以前的www下的文件能夠刪除了) 

5.cordova build andriod   最後根據提示找到你的apk

總之,cordova打包過程仍是比較簡單的,關鍵就是剛開始的環境配置問題比較多也比較繁瑣,可能會出一些小問題,也有些下載可能由於網絡的緣由出現問題。不過多試幾回,應該沒什麼問題。

相關文章
相關標籤/搜索