Cordova4.0 环境搭建-测试运行

对着背影说爱祢 提交于 2020-02-16 06:14:31

最近一直想搞 cordova ,但问题多多,网上找了很多资料,但也没多大进展。现在汇总下最近看的东西,如果有什么不清楚可以点击原文地址去查看。

 

一. 安装Node.js基本环境

  官网下载地址:https://nodejs.org/

  安装成功之后可以使用简单命令查看其版本

node -v

  npm相关命令

node cli.js install npm -gf         //安装最新的NPM
node cli.js install npm@1.0.105 -gf //可以安装指定版本的NPM

   安装Ant:http://ant.apache.org/

   安装Git: http://git-scm.com/

   下载Android SDK 以及开发工具,目前有Android Studio 工具比较方便

   共享一个Android SDK下载地址: http://pan.baidu.com/s/1i3vjl8T

二. 安装Cordova

  安装最新版本的Cordova

npm install -g cordova

  安装指定版本的Cordova

npm install -g cordova@4.0.0

  查看Cordova的基本信息情况

npm info cordova 

  更新Cordova版本

npm update cordova -g

   更多命令请查看官网

 

三. 创建一个解决方案

  指定一个工作目录,然后再cmd命令行总进入这个目录,比如M:\Android\PhoneGap0602

cd M:\Android\PhoneGap0602

  创建一个解决方案,使用如下命令,创建成功之后你会发现里面创建了bertphone文件夹

cordova create bertphone com.yourname.myapp BertPhone

         进入工程目录

cd bertphone

  添加对平台的支持

cordova platforms add android

  添加插件的支持

cordova plugin add org.apache.cordova.device 
cordova plugin add org.apache.cordova.console 

 

  以上内容摘录于http://www.cnblogs.com/qingyuan/p/4557715.html

 

 

如何创建Android 应用

这篇文章主要介绍下使用cordova创建Android的应用。原本我认为应该和ios一样简单,不过后面我发现错了,不是我想象中那样。我将我搭建的过程记录下来,作为经验记录,也希望对需要的朋友起到或多或少的帮助。

如果说不考虑Android本身的SDK以及虚拟机的话,使用cordova创建Andorid应用会向下面这般简单

1
2
3
4
5
6
7
8
9
10
11
# 进入app根目录
cd my-app
 
# 检查支持平台,如果有android,说明你可以开发android应用
cordova platforms list
 
# 创建应用
cordova platform add android
 
# 启动虚拟机
cordova emulate android

但是,这个前提是你本身已搭建好了Android开发环境,如果没有,抱歉,你会和我一样出现类似下面的错误提示:

Error: The command “android” failed. Make sure you have the latest Android SDK installed

怎么办呢?参考官方的文档 [点击查看],下面开始说说搭建Android开发环境

搭建Android开发环境

我是Mac系统,网上大多都是linux和windows的教程,这里我就不考虑了,我只记录mac下搭建过程

第一步、下载SDK

请在官方网站下载SDK

http://developer.android.com/sdk/index.html

第二步、设置SDK环境

下载好压缩包并解压缩后,根目录会有两个子目录,分别为

  • eclipse:编辑器
  • sdk:SDK目录

将SDK目录拷贝到指定位置,我这里设置到Mac当前用户的家目录

1
cp /adt-bundle-mac-x86_64-20140702/sdk  ~/Development/adt-bundle

设置PATH环境

1
$ vi ~/.bash_profile

末尾添加SDK路径

1
export PATH=${PATH}:$HOME/Development/adt-bundle/sdk/platform-tools:$HOME/Development/adt-bundle/sdk/tools

执行生效

1
source ~/.bash_profile

那到这里就完事了吗?朋友,告诉你,还没到一半,接着往下看吧

第三步,安装环境需要的软件及SDK

安装ant(如果你没有安装过的话)

这里我通过Mac的homebrew进行安装,如果你不了解可以看看这篇文章

Mac开发者利器-Homebrew介绍及安装

http://levi.yii.so/archives/1742

在终端里,执行下面命令安装ant

1
brew install ant

安装SDK

执行下面命令,打开 Android SDK Manager

1
android ; exit;

傻眼了吧,这么多,装哪些?别急,我也傻眼了,所以中间装了好多才成功,我这里总结下,但是可能不对,但是管他呢,作为初学者,这样至少能成功。如果你有好的文章,可以推荐给我。

如果你无法安装SDK,报dl-ssl连接不上的错,那么你可参考下面的文章修改本地HOSTS

不用FQ,即可访问google等网站hosts,及修改方法

http://levi.yii.so/archives/3553

我安装的SDK如下:

Tools下所有SDK,都安装了

没有原因,都装,我这里十来个,不知道干嘛的

Android L (API 20, L preview)

我本地的cordova当前使用的SDK是4.4.2,可能还没来得及更上版本,但是我看默认选中了几个项目,所以我这里就按照默认选中的那几项安装,包含有

  • SDK Platform Android L preview
  • Android TV ARM EABI v7a System image
  • Android TV Intel x86 Atom System image
  • ARM EABI v7a System image
  • Intel x86 Atom System image

Android 4.4w (API 20)

  • SDK Platform Android
  • Android Wear ARM EABI v7a System image
  • Android Wear Intel x86 Atom System image

Android 4.4.2 (API 19)

  • SDK Platform Android
  • ARM EABI v7a System image
  • Intel x86 Atom System image
  • Google APIs (x86 System Image)
  • Google APIs (ARM System Image)

上面的目录只是作为参考,并不是绝对的,最主要的SDK是Tools及API19,因为目前cordova使用的SDK就是API19,以后会根据情况改变

几个我碰到的问题,及解决方法

问题1:

Error: Please install Android target 19 (the Android newest SDK). Make sure you have the latest Android tools installed as well. Run “android” from your command-line to install/update any missing SDKs or tools.

解决方法:安装 android 4.4.2 sdk

问题2:

This platform has more than one ABI.

这个问题,可能是因为你本地环境中没有AVD模拟器,而如何创建AVD模拟器,咱稍后说,你先确保相应的SDK是否有安装好,即android 4.4.2 sdk中的System image。

第四步、创建AVD模拟器

看到现在,你是否和我一样,有种累觉不爱的感受。表急,这是最后一步了。

什么是AVD模拟器?

你可以将其当做为虚拟机,可以根据操作系统,OS版本而产生的不同的虚拟机

1.查看当前支持版本 (在列出的版本中我们需要记住id值,这个值在第2步中使用):

1
android list targets

这是我本地情况

Available Android targets:
----------
id: 1 or "android-19"
     Name: Android 4.4.2
     Type: Platform
     API level: 19
     Revision: 3
     Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in
 Tag/ABIs : default/armeabi-v7a, default/x86
----------
id: 2 or "android-20"
     Name: Android 4.4W
     Type: Platform
     API level: 20
     Revision: 1
     Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in, AndroidWearRound, AndroidWearSquare, AndroidWearRound, AndroidWearSquare
 Tag/ABIs : android-wear/armeabi-v7a, android-wear/x86
----------
id: 3 or "android-L"
     Name: Android L (Preview)
     Type: Platform
     API level: L
     Revision: 3
     Skins: HVGA, QVGA, WQVGA400, WQVGA432, WSVGA, WVGA800 (default), WVGA854, WXGA720, WXGA800, WXGA800-7in
 Tag/ABIs : android-tv/armeabi-v7a, android-tv/x86, default/armeabi-v7a, default/x86
----------
id: 4 or "Google Inc.:Google APIs:19"
     Name: Google APIs
     Type: Add-On
     Vendor: Google Inc.
     Revision: 7
     Description: Android + Google APIs
     Based on Android 4.4.2 (API level 19)
     Libraries:
      * com.google.android.media.effects (effects.jar)
          Collection of video effects
      * com.android.future.usb.accessory (usb.jar)
          API for USB Accessories
      * com.google.android.maps (maps.jar)
          API for Google Maps
     Skins: WXGA720, WVGA854, QVGA, WVGA800 (default), WSVGA, WXGA800-7in, WXGA800, WQVGA432, HVGA, WQVGA400
 Tag/ABIs : default/armeabi-v7a
----------
id: 5 or "Google Inc.:Google APIs (x86 System Image):19"
     Name: Google APIs (x86 System Image)
     Type: Add-On
     Vendor: Google Inc.
     Revision: 7
     Description: Android x86 + Google APIs
     Based on Android 4.4.2 (API level 19)
     Libraries:
      * com.google.android.media.effects (effects.jar)
          Collection of video effects
      * com.android.future.usb.accessory (usb.jar)
          API for USB Accessories
      * com.google.android.maps (maps.jar)
          API for Google Maps
     Skins: WXGA720, WVGA854, QVGA, WVGA800 (default), WSVGA, WXGA800-7in, WXGA800, WQVGA432, HVGA, WQVGA400
 Tag/ABIs : default/x86

2.1 创建AVD:

1
$ android create avd –n AVD-API16 –t 4
  • -n:AVD的名称,自定义
  • -t:最后的4表示创建Android版本的avd

我这里为什么选择4?

作为初学者,我也不知道选什么,但是我直觉告诉我有这么几个原因

  • 一定得是 Android 4.4.2 (API level 19)
  • 必须是 ARM 而不是Inter Atom,或是X86什么的

如果你也像我一样不知道如何选择,那么你可以一个个试试看

2.2 创建带SD卡的模拟器:

2.2.1 创建镜像文件

1
$ mksdcard 128M sdcard.img

2.2.2 创建AVD

1
$ android create avd -n AVD-API16 -t 4 -c "The path to SD"

3. 查看是否创建成功

1
$ android list avd

如果成功会显示刚才我们创建的avd信息

Available Android Virtual Devices:
    Name: AVD-API16
    Path: /Users/liwei/.android/avd/AVD-API16.avd
  Target: Google APIs (Google Inc.)
          Based on Android 4.4.2 (API level 19)
 Tag/ABI: default/armeabi-v7a
    Skin: WVGA800

4. 启动AVD模拟器

1
$ emulator -avd AVD-API16

或者

1
$ emulator @AVD-API16

5. 删除AVD模拟器:

1
$ android delete avd -n AVD-API16

我碰到的问题

在我创建好AVD后,一开始我使用的ID是5,通过cordova启动Android虚拟机出现错误

emulator: Failed to open the HAX device!

说明创建的AVD并不能被cordova项目所使用

解决办法:

  1. 删除刚才创建的AVD
  2. 创建一个新的AVD,ID为4

 

  以上内容摘录于:http://levi.yii.so/archives/3587

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!