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打包过程仍是比较简单的,关键就是刚开始的环境配置问题比较多也比较繁琐,可能会出一些小问题,也有些下载可能由于网络的缘由出现问题。不过多试几回,应该没什么问题。