cordova

先了解Cordova

cordova的作用是提供JavaScript调用移动设备的API接口,cordova只完成这一个工作,并且完成的很好。

 

Cordova并没有提供UI框架,因为开发人员需要使用css、HTML、JavaScript等技术来开发UI界面。

其次,程序开发人员都是有自己喜欢的ui框架,如果cordova提供了自己的UI 框架,那么用的人一定也不多。

 

 

前期准备

android Studio已经默认安装完成并且SDK下载完成

jdk1.8安装及环境变量配置,请注意是jdk1.8(https://jingyan.baidu.com/article/6dad5075d1dc40a123e36ea3.html)

android sdk 环境变量配置,不配置后面的cordova项目将会无法编译

ANDROID_HOME :F:\Android\sdk

PATH:;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools;

测试 cmd - adb

 

 

用命令行的方式部署Cordova

首先下载安装Node.js,为了使用其中安装的包管理工具npm(下载上传工具)。测试是否安装成功:npm -version

成功之后再通过npm安装cordova :  npm install -g cordova

如果出现 rollbackFailedOptional 错误 

原因:网不好  处理方法:使用淘宝的npm

找到node.js的安装目录 我的是 E:\nodejs\node_modules\npm  找到 npmrc 文件修改如下:

proxy = null
registry = https://registry.npm.taobao.org
disturl = https://npm.taobao.org/dist

 

再重新 npm install -g cordova

参考:Node.js之rollbackFailedOptional错误处理

测试cordova是否安装成功 :cordova -version

 

创建APP

自己创建根目录 mycordova 切换到根目录进行如下操作:

cordova create hello com.example.hello HelloWorld

 

添加目标平台

后续的操作都在项目目录或者项目目录的任何子目录中操作

cd hello

cordova_第1张图片

cordova platform add ios --save

cordova platform add android --save

 

cordova_第2张图片

 

创建平台的时候会遇到卡住不动的情况

cordova_第3张图片

貌似是npm镜像的原因,目前没发现具体问题出在哪。

隔了一天早晨一试又行了,

两个方向去思考:

1、npm镜像

2、同一个文件下面创建app的包名和文件名

验证npm镜像、设置淘宝镜像:https://blog.csdn.net/quuqu/article/details/64121812

 

 

检查当前平台设置情况: cordova platform ls

cordova_第4张图片

安装构建先决条件

检测是否满足构建平台的要求: cordova requirements 

cordova_第5张图片

 

出错原因:正是文章一开头所说的 android sdk 环境变量未配置造成的。

配置以后重新 

cordova requirements  

cordova_第6张图片

 

编译项目: 

cordova build

cordova_第7张图片

 

导入到Android Studio 

 

打开as,导入项目platforms路径下的android文件(发现项目经过编译以后图标和原生的android项目不一样),编译后的项目结构: (升级到最新版本的AS 3.1.3)

cordova_第8张图片

cordova_第9张图片

 

 

如果没更新到3.1.3版本会提示如下:

我用的android studio版本是2.3.3的,因为用顺手了一直没更新,这里要求更新到3.0

出现 some conflicts were found in the installation area 问题 点击cancel 退出更新的解决办法:

以管理员身份打开Android Studio 点击右下角的update 或者help里面更新

参考:解決 android studio更新失败的一种情况

 

AS更新以后 启动模拟器会出现GPU的弹窗提醒,并且模拟器非常卡顿,解决办法:

参照:https://blog.csdn.net/geekqian/article/details/77367901

https://www.jianshu.com/p/26b4d47fa5ef

 

如何在Android Studio里面编辑运行?

在assets    www    文件夹中写html和js

参照:Cordova入门 

 


学习历程:

1、Cordova开发App入门(一)创建android项目

2、cordova安装教程  

3、Node.js之rollbackFailedOptional错误处理

4、跨平台框架Cordova 命令行简介(CLI)

5、Android混合开发环境搭建(cordova)

6、android混合开发:cordova的安装使用 (最完整最清晰的一篇)

7、Cordova入门

 

根据W3C上的文档学习:

https://www.w3cschool.cn/cordova/cordova_battery_status.html

Cordova - 常用的插件汇总(附插件的安装、查询、更新、删除等命令)

 

你可能感兴趣的:(混合开发)