quasar框架+Cordova+Android开发环境搭建

本文对官方教程中做一些补充。

环境配置和虚拟机仿真（ubuntu）

为了使用cordova将quasar app打包为安卓应用，需要配置cordova环境和Android Studio环境。
根据教程的指示，安装cordova和Android Studio。其中Android Studio直接下载压缩包解压到/usr/local/下即可。
配置环境变量，在~/.bashrc中写入

export ANDROID_HOME="$HOME/Android/Sdk"
export ANDROID_SDK_ROOT="$HOME/Android/Sdk"
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_SDK_ROOT/tools; PATH=$PATH:$ANDROID_SDK_ROOT/platform-tools

需注意，这里第三行同原教程有所差别。

随后执行

cordova requirements

进行环境检查，发现缺少jdk8和gradle
安装必要的依赖：

sudo apt-get install openjdk-8-jdk
sudo apt-get install gradle

注：如java版本过高，可通过update-alternatives命令调整：

sudo update-alternatives --config java
sudo update-alternatives --config javac

启动Android Studio后，需进行如下准备工作：

1. 打开Android Studio，选择Tools-AVD Manager，加载一个虚拟机，选择X_64架构，模拟方式选择Software-GLES2.0（硬件仿真报错，原因不明）。
   
2. 打开Android Studio，选择Tools-SDK Manager，按需要加载必要的SDK。
   
3. 注意不要按Studio提示进行Gradle更新，防止破坏Cordova生成的工程的结构：
   
4. Android Studio编译出现Installed Build Tools revision 31.0.0 is corrupted解决：
   打开File-Project Structure，降低SDK版本:
   
5. 按照此处的教程进行后续步骤：

   #添加cordova模式
   quasar mode add cordova
   # 添加平台
   cd src-cordova
   cordova platform add android
   

最后，启动调试（注意，要在Android Studio开启的前提下执行）：

quasar dev -m cordova -T android

成功运行demo程序。

执行上述命令时会提示选择external IP，如果在模拟器调试，两者皆可，如用手机真机调试，需选择开发机的局域网IP，同时将开发机和手机接入同一个局域网。

真机调试

涉及蓝牙等硬件模块的调试无法使用模拟器进行，需要真机调试。
将安卓手机开启开发者模式后接入开发机即可进行真机调试，需注意将手机和开发机接入同一局域网以便混合应用实时的访问开发机的web资源，这些资源由webpack热加载提供，故可实时响应源码的修改，非常方便。
为提高效率，可使用chrome inspect进行跨设备调试:
在开发机的chrome浏览器中访问chrome://inspect/，可看到连接的手机，点击insprct即可。


注意：首次执行此操作需要开发机网络能够访问谷歌服务器，否则会白屏。

使用Icon Genie CLI处理图标

Icon Genie CLI可从一张原始图片自动生成一套复合设备要求的图标组。

icongenie generate -m cordova -i /path/to/source/icon.png

其中输入的原始图片必须为高清png图，分辨率不能小于64*64
执行中可能会报UnhandledPromiseRejectionWarning: Error，但实际上并没发现什么问题。

编译apk

开发完毕后，执行

quasar build -m android

如果资源下载部分比较慢，可以加阿里云资源代理ref，方法是在~/.gradle下新建init.gradle文件，填入：

allprojects {
    repositories {
      maven { url 'https://maven.aliyun.com/repository/central' }
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }
        maven { url 'https://maven.aliyun.com/repository/jcenter' }
        maven { url 'https://maven.aliyun.com/repository/public' }
        maven { url 'https://jitpack.io' }
    }
 
    buildscript { 
        repositories { 
           maven { url 'https://maven.aliyun.com/repository/central' }
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven { url 'https://maven.aliyun.com/repository/gradle-plugin' }
        maven { url 'https://maven.aliyun.com/repository/jcenter' }
        maven { url 'https://maven.aliyun.com/repository/public' }
        maven { url 'https://jitpack.io' }
        }
    }
}
 

生成的apk存放在.../src-cordova/platforms/android/app/build/outputs/apk/release/路径。
由于自制的app没经过签名认证，会被部分手机禁止安装，可在酷安应用市场下载mt管理器进行一键签名，非常方便。

添加使用cordova插件

进入src-cordova文件夹，用cordova命令添加需要使用的插件：

# from /src-cordova:
$ cordova plugin add cordova-plugin-battery-status

添加插件后，在前端代码挂载插件对象后即可使用，详见here。