Cordova环境安装配置

cordova其实就是一种移动web的框架,它的前身就是PhoneGap。后来PhoneGap捐献给Apache后,抽离出核心代码,就改名为cordova。Cordova支持如下移动操作系统:iOS, Android,ubuntu phone os, Blackberry, Windows Phone, Palm WebOS, Bada 和 Symbian。所以说应用还是很广泛的。

但是cordova的安装确实一件很麻烦的事情,所以下面介绍一下如何搭建cordova环境平台。

1. 下载node.js

官网地址是https://nodejs.org/en/,下载之后还要进行环境配置
这里写图片描述
在命令行下进行测试:node -v
这里写图片描述

2. 安装npm

其实在安装node.js的时候,已经顺带安装好了npm。
npm其实是node.js的包管理工具。我们在node.js上开发时,会用到很多别人写的JavaScript代码。如果我们要使用别人写的某个包,就可以直接通过npm安装使用,不用管代码存在哪,应该从哪下载。这是因为大家都把自己开发的模块打包后放到npm官网上。
这里写图片描述

3.安装ant

官网地址:http://ant.apache.org
从官网上下载得到一个这里写图片描述
解压缩之后,就要进行配置。例如我压缩的路径为:D:\Program Files (x86)\apache-ant-1.9.7

变量路径
ANT_HOMED:\Program Files (x86)\apache-ant-1.9.7
pathD:\Program Files (x86)\apache-ant-1.9.7\bin
classpathD:\Program Files (x86)\apache-ant-1.9.7\lib

配置好之后,在命令行里面进行测试
这里写图片描述

4.安装git

官网地址:https://www.git-scm.com/download/
安装git之后再进行配置,配置的话可以自己baidu一下
这里写图片描述

5.JDK安装和SDK

通常的java和android开发人员,jdk就基本都安装和配置好的了,而sdk的话,我比较建议是直接安装android studio,因为这里面有附带安装的,而我因为一早就安装好了android studio

变量
JAVA_HOMED:\Java\jdk1.8.0_91
PATH%JAVA_HOME%\bin
CLASSPATH.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar
6.安装cordova

经过以上一轮的艰辛操作之后,总算来到这一步了,可以进行安装了。
命令行下输入:npm install –g cordova
这里写图片描述
这一步可以说是非常非常非常慢的,通常你出去跑几圈,再喝杯咖啡回来再等,而且这还会看你的网速情况。
安装成功之后,
这里写图片描述

7.创建项目

cordova create hellowordl com.example.hello SMMC
其中:

变量说明
helloworld创建的文件的名称
com.example.hello创建的项目的包名
SMMCAPP客户端的名称,(不过其实可以在配置文件里面修改)

这里写图片描述
这里写图片描述

8.添加平台

进入刚才创建好的项目中
cordova platform add android
cordova platform add ios
这里写图片描述
接着打开helloworld–>platforms就可以看到多了两个文件
这里写图片描述
就可以分别用android studio和X-code导入项目

9.添加插件

例如文件传输,cordova plugin add cordova-plugin-file-transfer
这里写图片描述
插件的使用和安装名称,都可以在相应的github上有讲解
因为每次新安装一个插件,就会将之前各平台上的html,js,css清除,恢复原状,所以记得备份

10.编译项目还有测试项目

之前第8步说过,可以用相应的IDE编译项目,但是这里介绍的是直接在命令行进行打包和编译。进入项目的路径,输入cordova build
这里写图片描述
编译好之后,就可以在模拟器上或者是真机上进行运行
输入:cordova run android
这里写图片描述
这里写图片描述
这里面还会生成有apk文件,接着看看模拟器
这里写图片描述

但是如果想要测试ios的话,就只能在x-code上进行了。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
要在 Vue 2 中配置 Cordova 环境,你需要按照以下步骤进行操作: 1. 安装 Cordova 首先,你需要在本地计算机上安装 Cordova。你可以使用以下命令在终端中安装 Cordova: ``` npm install -g cordova ``` 2. 创建 Cordova 项目 运行以下命令创建 Cordova 项目: ``` cordova create myApp com.example.myApp MyApp ``` 其中,`myApp` 是项目的名称,`com.example.myApp` 是项目的包名,`MyApp` 是项目的标题。 3. 添加平台 要为你的应用程序添加平台,请运行以下命令: ``` cd myApp cordova platform add android ``` 这将在你的项目中添加 Android 平台。 4. 构建应用程序 在完成上述步骤后,你可以使用以下命令构建你的应用程序: ``` cordova build android ``` 这会在你的项目中构建 Android 应用程序。 5. 在 Vue 中集成 Cordova 要在 Vue 中集成 Cordova,请执行以下步骤: - 在 `public` 目录下创建一个 `cordova.js` 文件,并将其添加到 `index.html` 文件中: ``` <script src="cordova.js"></script> ``` - 在 `src/main.js` 文件中添加以下代码: ```javascript document.addEventListener('deviceready', onDeviceReady, false) function onDeviceReady () { console.log('Cordova is ready!') } ``` 这将在 Cordova 设备准备就绪时输出一条消息。 - 在 `package.json` 文件中添加以下代码: ```json "scripts": { "cordova-serve": "cordova serve" } ``` 这将允许你使用 `npm run cordova-serve` 命令启动 Cordova 服务器。 现在,你已经成功地在 Vue 2 中配置Cordova 环境。你可以使用 Cordova 提供的各种功能来开发移动应用程序。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值