WebApp开发之Cordova安装教程

1 安装Cordova

(Cordova开发环境的安装,包括所涉及的Node.js、Cordova CLI、JDK及Android SDK等,然后创建一个HelloWord项目。)

1.1 安装Node.js

https://nodejs.org 直接去官网下载并按默认路径安装就可以了。

安装完成后在命令行:   (测试成功!)

$ npm

1.2 安装Cordova CLI

命令行:

$ npm install -g cordova

如果安装不成功,一般是网络原因,可以找个FQ软件。我这边用的是proxy999。

安装成功后命令行:   (测试成功!)

$ cordova

1.3 部署Android开发环境

Cordova是一种Hybrid开发,可以被部署到android,ios等多个手机平台。这里我们以android为目标平台。

接下来我们开始android平台下相关环境的部署。

这里我们安装AndroidStudio,可以访问 http://www.android-studio.org/

里边有国内的下载镜像。

1.3.1 安装JDK

oracle官网 http://java.oracle.com/  (下不来的FQ~~)

或国内镜像 http://jdk.android-studio.org/

下载安装后,配置环境变量:http://www.cnblogs.com/yuzhongwusan/archive/2013/03/26/2982411.html

1.3.2 安装Android SDK

下载并安装AndroidStudio,http://developer.android.com/sdk/index.html

安装完成后配置sdk环境变量(cordova命令要用到):http://jingyan.baidu.com/article/f71d603757965b1ab641d12a.html

1.3.2 安装Ant

Ant是java平台下一个打包部署的工具,使用cordova命令的时候需要借助这个工具。

http://ant.apache.org/bindownload.cgi,下载zip压缩包,解压后配置环境变量:http://www.cnblogs.com/yuzhongwusan/archive/2013/03/26/2982411.html

2 创建Cordova的第一个应用 HelloWorld

我们在d:\\test 目录下新建一个项目

$ d:
$ cd test

先进入到目标文件夹,然后执行下面的命令

 

运行到浏览器:

$ cordova serve android

3. AndroidStudio导入Cordova项目

经过上一步的cordova项目build成功后,我们打开下面目录,会看到一个build.gradle,它就是我们项目的关键,因为项目本身就是用gradle来构建的。

最后一步,我们打开AndroidStudio来导入上面看到的.gradle文件,就可以在AndroidStudio中来编写我们的应用了,也可以很方便的在模拟器上预览。

初次导入的时候会从网络下载gradle相关的东西,要等个10分钟。导入完成后我们运行模拟器,效果:

好了,Cordova的环境搭建已经好了。其实本文更多的都是在说android的环境搭建,花的时间最多的也是这个,而且会有国内外网络的问题,会花不少时间。

时间: 2024-10-13 02:42:37

WebApp开发之Cordova安装教程的相关文章

webapp开发之bui入门环境搭建及执行npm命令报错解决

引言: BUI是一个WebApp开发使用的框架,使用这个框架开发呢的app支持跨多个平台部署,这样方便很多.要使用BUI,首先要安装以及部署环境,过程中确实很让新手头疼,记录一下,望后人能少踩坑. BUI的官方网站是:BUI(含快速入门教程) 1.下载完整的工程模板 : 步骤:下载多页开发包 开发包下载--解压. ps:网页中两个选项,单页开发包和多页开发包.选择多页开发包下载,下载后解压.可以看到一个完整的工程目录. 但是此时的情况就像是在idea编辑的java项目一样,仅仅是把代码写好了,或

安卓混合开发之Cordova,NativeWebView两种实现

转载请注明出处:王亟亟的大牛之路 如今混合开发已经不是新鲜词了,虽然作为源生的死忠我不怎么愿意去用H5实现我的功能,但是需求说了算...还是屈服了...然后就去了解了下,也抠了点Demo在这里分享给大家(也许网上有类似的,但是我这个肯定是可以run并且实现方式是不同的) 上内容之前,先说下纯H5 混合 纯native的各种区别,不了解的可以看下下面的简单描述(扣来的) 一.原生应用 优点 可访问手机所有功能(GPS.摄像头): 速度更快.性能高.整体用户体验不错: 可线下使用(因为是在跟Web相

laravel开发之-composer安装(windows)

1 在https://getcomposer.org/download/中下载composer.exe 2 选择php.exe安装composer 3 cmd命令框中输入composer.查看是否安装成功 4 打开https://pkg.phpcomposer.com/选择中国镜像,安装全局配置文件 5 安装成功后,输入命令:composer global require "laravel/installer",将laravel项目下载到本地 6 输入命令:composer globa

Linux开发之Nginx安装配置

Nginx("engine x")是一款是由俄罗斯的程序设计师Igor Sysoev所开发高性能的 Web和 反向代理 服务器,也是一个 IMAP/POP3/SMTP 代理服务器.在高连接并发的情况下,Nginx是Apache服务器不错的替代品. Nginx安装 系统平台:CentOSrelease6.6(Final)64位. 一.安装编译工具及库文件 yum-yinstallmakezlibzlib-develgcc-c++libtoolopensslopenssl-devel 二.

webapp开发之IIS进程调试

1.背景 1.当我的手机连接电脑的时候想要调试居然连接不上,之后我将项目发布之后才可以请求(同一局域网下) 2.你们不觉得发布到IIS再附加进程太烦了么?看了看网上全是这种方法,这不科学!VS已经提供了更好的方式了.  2.准备 1.电脑和手机在同一个网络下面.(外网请求,可以看我其他的博客了)   3.开始(.net core方式) 1.选择项目左键的项目属性 2.发布IIS程序,选择本地文件发布就可以了. 现在就只要启动你的IIS程序,然后vs也选择刚才创建的IIS启动方式就可以了,在启动的

安卓开发之APK安装之后自动在桌面上创建快捷图标

可以看到很多的APP在第一次运行之后就会弹出来一个Toast说什么快捷方式已创建,那么这个东西是怎么搞出来的呢 很简单就下面几句话,写在这儿以后好copy 先创建一个类 1 import android.app.Activity; 2 import android.content.Intent; 3 import android.os.Parcelable; 4 5 /** 6 * Created by Administrator on 2016/1/21. 7 */ 8 public clas

李洪强iOS开发之-cocopods安装

iOS开发之AsyncSocket使用教程

AsyncSocketDemo下载地址: AsyncSocketDemo 用socket可以实现像QQ那样发送即时消息的功能.客户端和服务端需要建立长连接,在长连接的情况下,发送消息.客户端可以发送心跳包来检测长连接. 在iOS开发中使用socket,一般都是用第三方库AsyncSocket,不得不承认这个库确实很强大.下载地址CocoaAsyncSocket . 使用AsyncSocket的时候可以做一层封装,根据需求提供几个接口出来.比如:连接.断开连接.发送消息等等.还有接受消息,接受到的

移动平台前端开发之WebApp代码技巧

1.首先我们来看看webkit内核中的一些私有的meta标签,这些meta标签在开发webapp时起到非常重要的作用 <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> <meta content="yes" name="apple-mobile-web