前言

前后使用cordova开发了几个项目了,之前完全没有接触过Hybrid App的开发,好在有搜索引擎,只是碎片化学习耗费的时间太多,是时候把学到的知识和经验总结一下。

开发环境

  • 安装Java JDK   (百度java jdk下载) ,安装后设置环境变量
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_131.jdk/Contents/Home
export CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar
export export PATH=$PATH:$JAVA_HOME/bin
  • 安装Android Studio (http://www.android-studio.org/) 安装后需要设置android sdk的本地路径,然后下载你要的android sdk版本,android sdk自带adt
export ANDROID_HOME=/Users/your_home/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
export PATH=$PATH:/Users/your_home/java/apache-ant-1.10.3/bin
  • 完整的环境变量设置
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_191.jdk/Contents/Home
export CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar
export ANDROID_HOME=~/Library/Android/sdk
export PATH=$PATH:$JAVA_HOME/bin:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools:~/java/apache-ant-1.10.3/bin

cordova cli 命令概要

Help:显示可用CLI命令的信息。
Create:创建Cordova项目并关联项目文件夹和文件。
Plateform:管理Cordova项目使用的移动平台。
Plugin:管理Cordova插件的安装和卸载。
Prepare:从Cordova项目的www文件夹复制web应用内容到项目移动平台项目文件夹中。
Compile:把web应用打包成Cordova应用。
Build:先执行Prepare命令然后打包web应用。
Emulate:在一个或多个移动设备平台的设备模拟器中运行Cordova应用。
Run:在一个或多个移动设备中运行Cordova应用。
Serve:启动一个服务器加载web内容以便于用浏览器访问。

命令实例

  • 安装cordova

npm install -g cordova

  • 创建项目

cordova create beihaoyun_app com.mycordova.app hello

  • 添加android平台

cordova platform add android@6.3.0

  • 查看已经添加的平台

cordova platform ls

  • 删除平台

cordova platform remove android

  • 从Cordova项目的www文件夹复制web应用内容到项目移动平台项目文件夹中。

cordova prepare android

  • 清理项目

cordova clean

  • 安装微信插件

cordova plugin add cordova-plugin-wechat --variable wechatappid=xxxxxxxx

最新版的2.3.0源码有问题,找到xu.li.cordova.wechat.Wechat的第281行,把getAppId改成getSavedAppId方法,第598行,getAppId()静态方法改为非static方法

安装2.1.0版本的wechat cordova plugin add cordova-plugin-wechat@2.1.0 --variable wechatappid=xxxxx

  • 查看已安装的插件

cordova plugin ls

  • 删除插件

cordova plugin remove cordova-plugin-wechat

  • 编译项目

cordova build android --verbose

  • 运行项目 (连接手机会在真机上运行)

cordova run android --verbose

  • sign - 生成数字签名文件

android studio 菜单 build -> Generate Signed APK -> 生成签名文件 -> Finish 生成APK

第一次使用的时候点击面板上的create new新建一个Key.store,密码一定要记住

使用面板生成的apk无法快速调试,有些插件我们希望电脑链接真机时,点击 Run 按钮就可以使用自定义签名文件、编译、打包。这就需要配置Android Studio运行自定义签名。

菜单 Build -> Edit Build Types -> Build Types -> Signing Config 选择一个签名配置 -> ok

常见错误解决

  • Error: spawn EACCES。一般是权限问题,修改gradlew权限即可

chmod 777 your_project/platforms/android/gradlew

  • 编译不通过时,命令后面加上 --verbose可以查看详细信息

cordova build android --verbose

  • 遇到奇葩问题时候,可能是缓存问题,清理下项目

cordova clean

  • 或者重新添加平台

cordova platform remove andorid --save

cordova platform add android --save

  • 将html代码放到 your_project/www 目录下,然后使用prepare命令拷贝到平台中去,使用run或build命令前会自动执行prepare命令。

cordova prepare android