vue + cordova实现跨平台android的开发

Vedu • 2021-08-31 06:48 • 技术资讯 • 阅读 885

前言：当前主流的跨平台框架有flutter , react native , cordova等等，这些框架的优越性笔者这里就不一一赘述了，选择什么框架主要是看公司的具体需求进行选择。如笔者选择cordova的原因大部分是为了通过electron对Windows的支持，废话我们少说直接开始。

一，环境安装

nodejs: 大家可以通过官网下载LTS版本，默认选择安装即可。地址：https://nodejs.org

vue：终端输入：

npm install -g @vue/cli

cordova: 终端输入：（官网地址：
https://cordova.apache.org/）

npm install -g cordova

android（cordova）：

1、jdk : 如果你做的项目没有对cordova有固定版本需求，建议结合android studio的jre版本去oracle官方网站下载对应的jdk LTS版本。如果对cordova有版本需求需要结合cordova的官方版本进行选择jdk版本,如cordova 8版本就得需要jdk1.8版本。关于怎么配置jdk需要配置系统环境path，网上搜索“jdk的配置”（结合使用的系统配置即可）太多了这里就不一一赘述了。

jdk地址：
https://www.oracle.com/java/technologies/java-se-glance.html （注：下载jdk需要oracle的账号，你可以自己注册一个，不建议去非官方网站去下载）

验证配置成功方式：终端输入java和javac如果有很多信息打印出来，那么恭喜你jdk配置成功了

cordova android查考：

地址：
https://cordova.apache.org/docs/en/10.x/guide/platforms/android/#page-toc-source

2、gradle: 跟jdk差不多，根据cordova版本的需求去下载和系统path配置（具体配置网上搜索“gradle的配置”结合使用的系统配置即可），地址：
https://gradle.org/releases/

验证成功方式：终端输入gradle如果有很多信息打印出来，那么恭喜你gradle配置成功了

cordova android查考：

地址：
https://cordova.apache.org/docs/en/10.x/guide/platforms/android/#page-toc-source

3、android studio : 的安装很简单大家可以根据自己的电脑情况在安装完android studio第一次后把sdk安装进容量大点的硬盘，下载地址:
https://developer.android.google.cn/studio

二、vue项目构建(假设我们的项目名为：vue-demo)，以下是笔者根据需求的选择供大家参考。

终端输入：vue create vue-demo

1、

2、

3、

4、

5、

6、

7、

8、构建成功后我们可以通过执行以下命令校验是否构建成功

  npm run serve

三、cordova项目构建

1、终端cd到vue-demo目录下执行：

cordova create native-cordova

2、接着我们cd进native-cordova目录下添加android环境，终端命令：

cordova platform add android

如图：

3、使用android studio 打开目录“
vue-demo/native-cordova/platforms/android”,之后在android studio下打开模拟器，如果没有就自己创建一个，如图

4、测试看cordova构建是否成功

四、@vue/cli-配置，如图：（图中的文件需要自己添加并在添加的文件中输入这些内容）

把public中的index.html移到项目目录下

配置cli:如,可通过 npm run start:cordova 命令直接android项目并自动打开模拟器安装vue-demo

至此我的的项目基本搭建完成了

内容出处：，

声明：本网站所收集的部分公开资料来源于互联网，转载的目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。如果您发现网站上有侵犯您的知识产权的作品，请与我们取得联系，我们会及时修改或删除。文章链接：http://www.yixao.com/tech/28238.html

vue + cordova实现跨平台android的开发

相关推荐

发表评论