vue+cordova 打包项目

第一次使用cordova过程,遇到了无数个坑,记录一下吧!

一、准备工作

如果你已经是一个前端开发人员,那么相信你的开发电脑已经安装了jdk,和node相关的环境了,然后的然后就是忽略准备工作中的第一个环节了不过确认一下是否安装过gradle。

然而如果你是一个刚入行的小白,那么我只能给你奉上相关的下载地址了,然后自行安装,安装教程网上一推的;

1.jdk,node,gradle环境安装

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

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

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

然后就是配置相关的JAVA_HOME环境变量了,网上教程很多,本文不在复制粘贴了。安装后打开cmd,然后查看是否安装和配置成功。

2.通过npm install -g cordova 安装cordova,如果网络不给力,就用npm config --global set registry http://registry.cnpmjs.org吧。

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 。

二、开始工作(附上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打包过程还是比较简单的,关键就是刚开始的环境配置问题比较多也比较繁琐,可能会出一些小问题,也有些下载可能因为网络的原因出现问题。不过多试几次,应该没什么问题。

 

 

 

 

 

猜你喜欢

转载自www.cnblogs.com/zhou123/p/9253543.html