cordova

easy create your hybird app with cordova

文档

bnorth 文档

hybird 开发

Env

Android

1. Install Java 1.8 or later
2. Install Gradle
3. Android SDK

utils

1. adb logcat --pid adb shell ps -ef | grep {package name} | awk '{print $2}'

IOS

1. xcode
2. command build tools

Get Started

npm install bnorth-cordova
npx bnorth-cordova

Usage

1. npx bnorth-cordova config: sync package.json to cordova project config, such as name, version, etc
2. npx bnorth-cordova web: sync web publish file to cordova project
3. npx bnorth-cordova platform add android: add android platform
4. npx bnorth-cordova plugin add xxx: add cordova plugin
5. npx bnorth-cordova build android: build and gen android apk
6. npx bnorth-cordova run android: build and install gen apk to your phone connected
7. Check Cordova Doc for more details

Example

npx bnorth-cli create yourapp
cd yourapp
npm run build
npm install bnorth-cordova
npx bnorth-cordova web
npx bnorth-cordova platform add android
npx bnorth-cordova build android

Name

There are some ways to set app name in Package.json, priority to rank, from high to low are:

1. displayName[Platform], such as displayNameAndroid
2. displayName
3. name

{
  ...
  "name": "app name",
  ...
}

Id and Version

Set app id and version, for android it is the package id and package version, for ios it is bundle id and bundle version

{
  ...
  "id": "app id",
  "version": "1.0.0",
  ...
}

Icon

Set app icon, use same icon for all platform

{
  ...
  "icon": "../res/logo.png",
  ...
}

Or set icon on ./cordova/config.xml, for more detail link to Icon

Splash

Splash

App Config

Config app options

{
  ...
  "preferences": {
    "key":"value"
  }
  ...
}

1. BackgroundColor: Sets the app's background color. color string
2. Orientation: orientation. default, landscape, portrait

For more preference link to preference

App Sign

1. move sign file to res dir
2. config package.json the relative path is ./cordova

{
  ...
  "buildParams": {
    "android": {
      "debug": {
        "keystore": "../res/your.keystore",
        "storePassword": "your store password",
        "alias": "your alias",
        "password" : "your password",
        "keystoreType": ""
      },
      "release": {
        "keystore": "../res/your.keystore",
        "storePassword": "your store password",
        "alias": "your alias",
        "password" : "your password",
        "keystoreType": ""
      }
    },
    "ios": {
      "debug": {
        "codeSignIdentity": "your code sign identity installed",
        "provisioningProfile": "your code sign provisioning profile installed",
        "developmentTeam": "your team with sign",
        "packageType": "development"
      },
      "release": {
        "codeSignIdentity": "your code sign identity installed",
        "provisioningProfile": "your code sign provisioning profile installed",
        "developmentTeam": "your team with sign",
        "packageType": "app-store"
      }
    }
  },
  ...
}

1. npx bnorth-cordova config

Other Config

Edit cordova/confix.xml and refer to config.xml

Usefull Cordova Plugins

Android Performance

Use plugin crosswalk webview

npx bnorth-cordova plugin add cordova-plugin-crosswalk-webview
npx bnorth-cordova plugin add cordova-android-support-gradle-release

Android Permissions

cordova-plugin-android-permissions

Image Multi Picker with Camera

cordova-plugin-adam-imagepicker

Qrcode

phonegap-plugin-barcodescanner

Use Native Navigator

cordova-plugin-yc-navigator

GeoLocation

cordova-plugin-baidu-geolocation-c cordova-plugin-baidumaplocation https://github.com/ETENG-OSP/cordova-plugin-baidu-geolocation.git

Custom Statusbar

cordova-plugin-statusbar

QQ Sdk for Oath, Share

cordova-plugin-qqsdk

Wechat Sdk for Oath, Share

cordova-plugin-wechat https://github.com/xu-li/cordova-plugin-wechat

Weibo Sdk for Oath, Share

cordova-plugin-weibo

Alipay payment

cordova-plugin-alipay-v2

More Plugins

cordova plugins

issues

launch error

• cordova the connection to the server was unsuccess file:///android_asset/www/index.html

  1. add belows to config.xml

    <platform name="android">
        <preference name="loadUrlTimeoutValue" value="600000" />
    </platform>

  2. move code to main.html, update index.html

  <script type="text/javascript">window.location="./main.html"</script>

build error

repositories { maven{ url 'https://maven.aliyun.com/repository/google'} maven{ url 'https://maven.aliyun.com/repository/gradle-plugin'} maven{ url 'https://maven.aliyun.com/repository/public'} maven{ url 'https://maven.aliyun.com/repository/jcenter'} }