命令行创建Cordova项目

按步骤安装Cordova环境,并通过命令行创建第一个Cordova项目

Posted by catface on January 1, 2015

本系列目录:
1、进入Cordova官网,使用命令创建Cordova项目.
2、了解Cordova官网,按照官网步骤使用常用Cordova插件.
3、学习Cordova,开发自定义Cordova插件.
补、本系列Cordova基于Crosswalk,对于只使用原生WebView来说影响不大.

操作步骤

  • 事先确保本机已安装JDK、SDK并配置好JAVA_HOME、ANDROID_HOME环境,如下图.

  • 安装ANT并配置环境,如图.

  • 安装Node.js,如图,点击DOWNLOADS.

  • 装好Node.js,即可使用命令 npm install cordova 安装Cordova环境,装好之后如下. 也可使用 npm install -g cordova 将Cordova安装在全局目录

  • 由于小伙伴常用Ionic,可以顺带 npm install ionic 集成进来,如下. 同理,可使用 npm install -g ionic 将Ionic安装在全局目录

  • 没有意外的话,此时已可用命令cordova create aa com.catface.aa Aa来创建项目了.

    • aa:保存工程的文件夹名
    • com.catface.aa:项目包名
    • Aa:项目名称


    • 进入文件夹,可见工程目录:hooks:存放自定义cordova命令的脚本文件.
    • platforms:各平台原生代码,勿手动修改.
    • plugins:插件目录.
    • www:源代码目录,cordova prepare时候会copy到各平台工程的assets\www目录.
    • config.xml:cordova配置文件.


  • cordova platform add android后会在工程的platforms/android目录下生成标准的集成了Cordova功能的Android项目.

    • cordova platform ls:列出已有平台
    • cordova platform rm android:删除已有相应平台


  • 再次,我们尝试添加一个简单插件cordova plugin add cordova-plugin-media

    • cordova plugin ls:列出已有插件
    • cordova plugin rm cordova-plugin-media:删除已有相应插件

  • cordova build或者cordova prepare或者cordova compile来进行编译.

  • 最后,真机插上,adb连接好cordova run就能运行创建好的Cordova项目了.

总结

完整环境概括如下:

  1. 安装JDK、SDK并配置好环境.

  2. 安装Node.js并配置好环境.

  3. 安装ANT并配置好环境.

  4. 使用Node.js的>npm<命令安装Cordova和Ionic.

  5. 使用>Cordova create<创建项目.

  6. 切进项目目录,使用>cordova platform add<添加平台(可同时引进crosswalk支持).

  7. 使用>cordova plugin add<添加插件.

  8. 使用>cordova build<编译(也可直接run,run之前会自己编译).

  9. 使用>cordova run<进行装机测试.