iOS下JS与OC互相调用(七)--Cordova 基础
Cordova 简介
在介绍Cordova之前,必须先提一下PhoneGap。PhoneGap 是Nitobi软件公司2008年推出的一个框架,旨在弥补web 和iOS 之间的不足,使得web 和 iPhone SDK 之间的交互更容易。后来又加入了Android SDK 和BlackBerry SDK,再然后又陆续加入了更多的平台。
但是在2011年,Nitobi公司被Adobe收购,PhoneGap也被提交到Apache Incubator。由于Adobe现在拥有PhoneGap商标,PhoneGap v2.0版产品就更名为Apache Cordova。
据说Cordova是Nitobi团队当时坐落的街道名称,用此名来纪念Nitobi团队的贡献。Apache Cordova是从PhoneGap中抽出的核心代码,是驱动PhoneGap的核心引擎。
上图是目前Cordova支持的平台,摘自Cordova官网,它们分别是Android、iOS、Windows Phone、BlackBerry、ubuntu、火狐、LGwebOS、FireOS。
Cordova工程结构
从下面这幅图可以看出Cordova工程的结构,以及与Native API 之前的关系。
Get Started Fast
官网中也把Cordova 的使用划分了一些步骤。按照这五个步骤,可以很容易的创建一个Cordova Demo 工程起来,但是实际的使用要比这个Demo 工程复杂的多。
* 1. 安装Cordova *
Cordova 命令行需要运行在 Node.js 上,在 NPM 也可用。我们可以按照 platform specific guides 去安装别的依赖平台。因此,在安装Cordova之前,要先安装Node.js 和 NPM(可以参考文章Mac 下安装Node.js)。打开命令行提示符(Windows 下) 或者 终端 (Mac 下),然后输入 npm install -g cordova
即可安装Cordova。
如果安装失败,看到下面的错误提示信息,说明我们要用管理员身份安装。
以管理员身份安装Cordova的命令:
sudo npm install -g cordova
安装过程可能比较慢,安装成功后,可以看到类似如下的目录结构,并且没有错误信息:
* 2.创建一个工程 *
用命令行工具创建一个空的Cordova工程。首先跳转到 你希望保存新工程的文件夹(命令是 cd 文件夹路径
),然后输入命令 cordova create 工程名
。
当然,我们也可以直接 输入命令 cordova create 文件夹路径/工程名
,在某个文件夹下直接创建工程。
查看更多的创建工程命令,可以输入命令 cordova help create
。
我在终端中输入如下命令:
cordova create /Users/harvey/Desktop/Other/MyApp
然后在Other 文件夹中就创建了一个叫MyApp的文件夹:
目录结构如下:
* 3.添加平台 *
创建完Cordova 工程之后,跳转到工程文件夹(命令是 cd 文件夹路径
)。
我这里使用的命令是:
cd /Users/harvey/Desktop/Other/MyApp
然后在这个文件夹中,我们需要添加一个 App 需要支持的平台。 添加一个平台,需要输入命令:
cordova platform add <platform name>
例如我们需要支持浏览器,那么就输入:
cordova platform add browser
如果我们需要支持iOS,那么就输入:
cordova platform add ios
注意ios 要小写。
查看Cordova可以支持的平台,可以输入 :
cordova platform
我输入cordova platform
之后,终端显示的结果:
HarveydeMac-mini:MyApp harvey$ cordova platform
Installed platforms:
browser 4.1.0
ios 4.2.1
Available platforms:
amazon-fireos ~3.6.3 (deprecated)
android ~5.2.0
blackberry10 ~3.8.0
firefoxos ~3.6.3
osx ~4.0.1
webos ~3.7.0
Installed platforms
是我已经安装过的平台,Available platforms
是还可以安装的平台。
* 4.运行 App *
使用命令行工具,运行App的命令是:
cordova run <platform name>
例如,我想在浏览器中运行 App,我就在终端里输入:
cordova run browser
然后,就会打开浏览器,就会运行App。下面是我的命令和运行效果图:
当然,如果我们想要在iOS 上运行 App,我们也可以输入:
cordova run ios
也可以到指定目录下打开iOS 工程文件
查看更多的关于运行App 的命令,可以输入 cordova help run
。
iOS下JS与OC互相调用(七)--Cordova 基础的更多相关文章
- iOS下JS与OC互相调用(六)--WKWebView + WebViewJavascriptBridge
上一篇文章介绍了UIWebView 如何通过WebViewJavascriptBridge 来实现JS 与OC 的互相调用,这一篇来介绍一下WKWebView 又是如何通过WebViewJavascr ...
- iOS下JS与OC互相调用(五)--UIWebView + WebViewJavascriptBridge
WebViewJavascriptBridge是一个有点年代的JS与OC交互的库,使用该库的著名应用还挺多的,目前这个库有7000+star.我去翻看了它的第一版本已经是4年前了,在版本V4.1.4以 ...
- iOS下JS与OC互相调用(四)--JavaScriptCore
前面讲完拦截URL的方式实现JS与OC互相调用,终于到JavaScriptCore了.它是从iOS7开始加入的,用 Objective-C 把 WebKit 的 JavaScript 引擎封装了一下, ...
- iOS下JS与OC互相调用(一)--UIWebView 拦截URL
最近准备把之前用UIWebView实现的JS与原生相互调用功能,用WKWebView来替换.顺便搜索整理了一下JS 与OC 交互的方式,非常之多啊.目前我已知的JS 与 OC 交互的处理方式: * 1 ...
- iOS下JS与OC互相调用(二)--WKWebView 拦截URL
在上篇文章中讲述了使用UIWebView拦截URL的方式来处理JS与OC交互. 由于UIWebView比较耗内存,性能上不太好,而苹果在iOS 8中推出了WKWebView. 同样的用WKWebVie ...
- iOS下JS与OC互相调用
背景情况: app项目中有几个界面是需要经常变动的(不仅是内容还有UI布局等),比如活动宣传界面就是属于这一类.但是由于AppStore提交审核也是需要时间的,就算审核快,也不至于每次都为了这点事频繁 ...
- iOS下JS与OC互相调用(八)--Cordova详解+实战
扯两句,可以跳过 由于项目中Cordova相关功能一直是同事在负责,所以也没有仔细的去探究Cordova到底是怎么使用的,又是如何实现JS 与 OC 的交互.所以我基本上是从零开始研究和学习Cordo ...
- iOS下JS与OC互相调用(七)--Cordova 环境搭建
Cordova大家可能比较陌生,但肯定听过 PhoneGap ,Cordova 就是 PhoneGap 被 Adobe 收购后所改的名字.它是一个可以让 JS 与原生代码互相通信的一个库,并且提供了一 ...
- iOS下JS与OC互相调用(八)--Cordova简单实战
新建工程,添加Cordova 关键类 新建一个工程TestCordova 然后添加:confug.xml.Private 和 Public 两个文件夹里的所有文件 然后build 发现报错 为什么有会 ...
随机推荐
- 织云Lite发布:详解包管理核心能力
本文由 织云平台团队 发布于 腾讯云云+社区 织云Lite发布 腾讯织云自动化运维体系经过10年技术积淀,维护近万个业务模块,超过20万节点.鉴于业界朋友的呼声,我们将织云的核心功能独立抽象出来,凝结 ...
- Java中对象比较的方法
class Person{ private String name; private int age; public Person(String name,int age){ this.name = ...
- [HNOI 2015]开店
Description 风见幽香有一个好朋友叫八云紫,她们经常一起看星星看月亮从诗词歌赋谈到 人生哲学.最近她们灵机一动,打算在幻想乡开一家小店来做生意赚点钱.这样的 想法当然非常好啦,但是她们也发现 ...
- [HNOI2011]任务调度
题目描述 有 N 个任务和两台机器 A 与 B.每个任务都需要既在机器 A 上执行,又在机器 B 上执行, 第 i 个任务需要在机器 A 上执行时间 Ai,且需要在机器 B 上执行时间 Bi.最终的目 ...
- 【IOI1998】Picture(扫描线+线段树)
问题来源:IOI1998 D2T1 题意:就是在一个平面内给出n个矩形,叫你计算将这些矩形合并以后,新图形的周长. 例如: 上图是原本的矩形们 ---------->合并后的图形 解题思路:拿一 ...
- bzoj 2229: [Zjoi2011]最小割
Description 小白在图论课上学到了一个新的概念--最小割,下课后小白在笔记本上写下了如下这段话: "对于一个图,某个对图中结点的划分将图中所有结点分成两个部分,如果结点s,t不在同 ...
- [Codeforces]663E Binary Table
某变换好题.不过听说还有O(2^n*n^2)DP的…… Description 给定一个n*m的01矩阵,你可以选择对任意行和任意列取反,使得最终“1”的数量尽量少. Input 第一行两个整数n,m ...
- NOIWC颓废记
NOIWC大概就干了3件事情:吃.睡.浪. 吃: 目测绍兴一中的饭比二中的好吃多了,每天都有挺多的肉菜,还有一些甜品,而且是自助,不错的,但是一个不好的是排队时间太长了,于是我这么珍惜时间急着回宿舍的 ...
- Android毕业设计-微圈
勤拂拭软件出品,必属精品 : 勤拂拭软件 去年做了一个类似于我的朋友圈的项目,主要功能就是用户可以实时发表自己的动态,好友可以评论点赞什么的,可以建群,聊天啊,拉黑啊,反正是一个不错的社交软件,包含服 ...
- YOLO: 3 步实时目标检测安装运行教程 [你看那条狗,好像一条狗!]
封面图是作者运行图,我在 ubuntu 环境下只有文字预测结果. Detection Using A Pre-Trained Model 使用训练好的模型来检测物体 运行一下命令来下载和编译模型 gi ...