Cordova 开发环境的搭建

Cordova 为目前做混合式开发中比较受欢迎的一个解决方案了，并且拥有比较丰富的插件资源。本文介绍了 Cordova 开发的环境搭建过程。由于 Cordova 命令行工具发布在了 npm 包管理平台上，npm 为 nodejs 内置的包管理工具，所以安装 cordova 前需要先确认你是否已经安装过 Nodejs。

Nodejs 安装

打开 Nodejs 官网下载页，根据自己当前的操作系统平台，选择对应的 nodejs 版本，下载完后直接点击安装程序，下一步完成即可。测试 nodejs 安装，打开控制台，输入：

    node -v // 查看node版本plain
    npm -v // 查看npm版本

如果控制台成功输出当前程序安装的版本，那么你已经安装成功了。

Nodejs 版本管理工具(Nvm)

由于 Nodejs 目前的更迭速度很快，有时候项目组人员的版本可能各不相同，为了避免出现不必要的问题，尽量统一管理 node 的版本，所以我们需要 nvm 这样一个版本管理工具，来轻松的达到自由切换 nodejs 和 npm 版本的问题。

Linux 平台，Mac 安装和更新 curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.29.0/install.sh | bash 或者

    wget -qO- <https://raw.githubusercontent.com/creationix/nvm/v0.29.0/install.sh> | bashplain

打开控制台输

    nvm --version // 查看nvm版本

如果成功输出，那么 nvm 就安装成功了。更多的 nvm 可以在控制台通过 nvm –help 查看。

当然如果发现控制台找不到 nvm 这个全局变量的话，那么我们可以尝试手动添加的方式。

打开~/.bashrc, ~/.profile, ~/.bash_profile , 或者~/.zshrcc 文件，在文件后面添加变量环境导出的代码：

export NVM_DIR="$HOME/.nvm"plain
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm

同样的，进行完变量导出后，可通过上面的 nvm –version 查看安装结果。

windows 安装

nvm 提供了 windows 上的安装器，可以在这里下载, 然后直接点击安装即可。

Cordova 安装

好了，搭建完这些基本工具后，终于可以安装 cordova 了。

在 OSX 或者 Linux 平台：

sudo npm install -g cordovaplainplain

Windows 平台:

C:\>npm install -g cordovaplainplain

同样的，安装完成后，可以通过

cordova -vplainplain

命令查看安装结果。成功输出当前的 cordova 版本，那么你就安装成功了。

创建 Cordova 项目和模拟器运行

切换到你的 workspace 目录，执行

cordova create hello com.example.hello HelloWorldplain

这个命令会帮我们自动在 workspace 目录下创建一个名为 hello(即第一个参数）的文件夹，里面会包含几个子文件目录，第二个参数 com.example.hello 即为项目包的一个标识符，就像 java 项目中的某个包名一样。当然你可以在创建的时候就添加上去，如果不添加，cordova 会帮你自动生成，而你之后可以在根目录下的 config.xml 下手动去更改这个项目标识名称。最后一个 HelloWord 为程序显示的标题名称。同样如果不写 cordova 会自动生成，也可以在 config.xml 下手动配置。创建完后，我们一个可以看到 workspace 下为我们生成的这个项目目录以及相关初始化文件。

添加运行平台：

cordova platform add android // 安卓plain
cordova platform add ios    // 苹果
cordova platform add wp8    // wp8

查看添加的运行平台：

cordova platform lsplain

构建命令：

cordova build // 自动构建所以你添加的平台
cordova build platformName // 根据平台名称构建
cordova build android // 构建安卓平台

在模拟器运行安卓（这里假设你电脑装了安卓 SDK 的环境）

cordova emulate androidplainplainplain

另外，你也可以直接连上你的手机直接测试，运行：

cordova run androidplainplain

运行命令后，程序会自动构建初始化，并打开模拟器，然后运行当前的程序。

安装安卓 SDK

上面的运行示例中直接假设你已经安装好了安卓的运行环境，如果没有安装的话，那么可以参考下面的教程。

下载安装

打开安卓 SDK 安装的页面，当然如果你没有使用 Android Studio 的话，那么就直接点击下载 SDK, 下载完后直接解压到一个例如 andoid-sdk 的目录下面即可。

解压完后，我们可以切换到解压文件下 android-sdk/tools 目录下，我们可以通过./android 命令运行 SDK 程序，运行后，应该就会打开一个 SDK 管理界面，然后根据所需下载相应版本的 SDK。由于谷歌被墙，所以如果你身边的同事已经有安卓开发环境的话，最好直接从他们那边拷贝环境即可，不然这个非常难下载。

配置 SDK 环境变量

上面我们安装完后，可以在 tools 目录下通过命令直接打开 SDK 管理工具，但是为了更方便的全局访问，我们给它添加全局变量。在 OSX 或者 Linux 下，我们打开或者创建~/.bash_profile 文件，然后添加如下代码：

export PATH=${PATH}:/Users/ziv/Documents/development-android/android-sdk
/platforms:/Users/ziv/Documents/development-android/android-sdk/toolsplain

以上是我电脑上面配置的实例代码。配置好后，在控制台直接输入：android 命令，如果成功打开 SDK 管理工具，那么就成功了。至于 windows 的环境变量配置，这里就不多说了。

创建模拟器

成功安装完 SDK 管理工具后，我们需要创建一个模拟器：

运行 android 命令，打开包管理工具选择菜单上面的 tools -> Manage AVDs 在模拟器管理界面选择 create 根据你所要的 SDK 版本，设备，硬件参数来创建一个模拟器填写完毕后点击 OK 即可配置好这一切后，我们再用 cordova emulate android 命令启动模拟器。模拟器如果成功启动，则会直接打开我们的这个 HelloWorld 应用。在使用途中我们会发现，安卓 SDK 自带的模拟器相当的卡顿，反应异常慢，所要跟安卓同事交流后，他们推荐我使用 Genymotion.

Genymotion 模拟器的安装使用

打开 genymotion 的下载页面，这里我们需要下载个人版本的 genymotion, 因为其他版本需要收费，另外你要先在这个网站注册一个账号。

下载 Genymotion 完并安装后，点击运行发现出现了无法运行的情况，提示你需要安装 VirtualBox，因为 Genymotion 依赖 VirtualBox 虚拟机, 所以我们打开 VirtualBox, 找到下载按钮点击下载安装包程序，下载完成后直接点击安装即可。

安装完成后，运行 Genymotion, 然后点击 add，创建一个模拟器，如图

图中的 Custom Phone 则为我已经创建好的。创建好后，点击 start 即可。如果发现启动时 VirtualBox 出现无法启动并抛出类似权限异常的情况下，我们可以通过如下命令赋权：

    sudo chmod -R 777 /Applicationsplain
    sudo chmod -R 777 /Applications/VirtualBox.app

然后重新启动。正常情况下，genymotion 会打你之前添加的模拟器，然后在 cordova 中运行 genymotion 模拟器，直接通过运行如下命令：

    cordova run android

程序会自动在 genymotion 中运行起来。

参考

https://nodejs.org/en/download/ https://github.com/creationix/nvmhttp://cordova.apache.org/docs/en/latest/guide/cli/index.html http://developer.android.com/sdk/installing/index.html?pkg=tools https://www.genymotion.com/#!/developers/user-guide

最后修改于 2015-11-23