cordova是用web編寫的移動端程序慎式，通過調(diào)用原生SDK的方式在js內(nèi)部編寫交互程序，然后加殼包裝趟径。

重要提示

采用混合開發(fā)的方式可以有很多種瘪吏，具體要根據(jù)項目的不同類型采用不同的方式，cordova是一款不錯的混合框架蜗巧，但是仍然無法和原生比性能掌眠，來自cordova官方的建議是如果你要做的是大型應用或者數(shù)據(jù)量較大，cordova并不是最佳選擇幕屹。

環(huán)境配置

• Node 6.9.2
• Android
  • Git 2.11
  • AndroidSDK(v19及以上)
  • JDK(7及以上)
• IOS
  • Xcode
  • 終端
• 以下演示都用Android為例扇救，不同的地方會標注

安裝Cordova

這幾天一直用GitShell，直到今天突然發(fā)現(xiàn)windows居然也可以用香嗓，所以就直接演示windows下的吧

• 打開git
• 安裝npm install -g cordova
• 檢查cordova -version or cordova -v

創(chuàng)建一個Cordova項目

• 創(chuàng)建一個workspace
  • C:\Users\Administrator>cd E:\Cordova
  • C:\Users\Administrator>e:
• 創(chuàng)建項目
  • E:\Cordova>cordova create CordovaWindows com.jty.mycordova MyCordova
  • 得到提示Creating a new cordova project.
  • down迅腔！
• 創(chuàng)建釋義
  • CordovaWindows 項目名
  • com.jty.mycordova包名
  • MyCordovaAppName

添加平臺支持

• 進入剛創(chuàng)建的工程目錄
• windows
  • cordova platform add android
• Mac
  • $ cordova platform add IOS
  • $ cordova platform add android
• 運行結(jié)果如下

  E:\Cordova\CordovaWindows>cordova platform add android
  Adding android project...
  Creating Cordova project for the Android platform:
      Path: platforms\android
      Package: com.jty.mycordova
      Name: MyCordova
      Activity: MainActivity
      Android target: android-25
  Subproject Path: CordovaLib
  Android project created with cordova-android@6.1.2
  Discovered plugin "cordova-plugin-whitelist" in config.xml. Adding it to the project
  Fetching plugin "cordova-plugin-whitelist@1" via npm
  Installing "cordova-plugin-whitelist" for android
  
             This plugin is only applicable for versions of cordova-android greater than 4.0. If you have a previous platform version, you do *not* need this
  plugin since the whitelist will be built in.
  

構(gòu)建項目

第一次構(gòu)建可能有點慢，因為需要配置Gradle

• 先看看項目結(jié)構(gòu)

  E:\Cordova\CordovaWindows>ls
  config.xml  hooks  platforms  plugins  www
  

  • 配置文件 config.xml
  • 關聯(lián)文件 hooks
  • android項目 platforms
  • 插件庫 plugins
  • web項目 www

• 構(gòu)建項目

  • cordova build android

• 構(gòu)建效果

E:\Cordova\CordovaWindows>cordova build android
ANDROID_HOME=E:\64androidstudio\Android\Sdk
JAVA_HOME=E:\JDK
Subproject Path: CordovaLib
Starting a new Gradle Daemon for this build (subsequent builds will be faster).
Incremental java compilation is an incubating feature.
:preBuild UP-TO-DATE
:preDebugBuild UP-TO-DATE
:checkDebugManifest
:CordovaLib:preBuild UP-TO-DATE
:CordovaLib:preDebugBuild UP-TO-DATE
:CordovaLib:checkDebugManifest
:CordovaLib:prepareDebugDependencies
:CordovaLib:compileDebugAidl
:CordovaLib:compileDebugNdk UP-TO-DATE
:CordovaLib:compileLint
:CordovaLib:copyDebugLint UP-TO-DATE
:CordovaLib:mergeDebugShaders
:CordovaLib:compileDebugShaders
:CordovaLib:generateDebugAssets
:CordovaLib:mergeDebugAssets
:CordovaLib:mergeDebugProguardFiles
:CordovaLib:packageDebugRenderscript UP-TO-DATE
:CordovaLib:compileDebugRenderscript
:CordovaLib:generateDebugResValues
:CordovaLib:generateDebugResources
:CordovaLib:packageDebugResources
:CordovaLib:processDebugManifest
:CordovaLib:generateDebugBuildConfig
:CordovaLib:processDebugResources
:CordovaLib:generateDebugSources
:CordovaLib:incrementalDebugJavaCompilationSafeguard
:CordovaLib:compileDebugJavaWithJavac
:CordovaLib:compileDebugJavaWithJavac - is not incremental (e.g. outputs have ch
anged, no previous execution, etc.).
?: ?Щ???????????????????? API??
?: ?й???????, ????? -Xlint:deprecation ???±???
:CordovaLib:processDebugJavaRes UP-TO-DATE
:CordovaLib:transformResourcesWithMergeJavaResForDebug
:CordovaLib:transformClassesAndResourcesWithSyncLibJarsForDebug
:CordovaLib:mergeDebugJniLibFolders
:CordovaLib:transformNative_libsWithMergeJniLibsForDebug
:CordovaLib:transformNative_libsWithSyncJniLibsForDebug
:CordovaLib:bundleDebug
:prepareAndroidCordovaLibUnspecifiedDebugLibrary
:prepareDebugDependencies
:compileDebugAidl
:compileDebugRenderscript
:generateDebugBuildConfig
:generateDebugResValues
:generateDebugResources
:mergeDebugResources
:processDebugManifest
:processDebugResources
:generateDebugSources
:incrementalDebugJavaCompilationSafeguard
:compileDebugJavaWithJavac
:compileDebugJavaWithJavac - is not incremental (e.g. outputs have changed, no p
revious execution, etc.).
:compileDebugNdk UP-TO-DATE
:compileDebugSources
:mergeDebugShaders
:compileDebugShaders
:generateDebugAssets
:mergeDebugAssets
:transformClassesWithDexForDebug
:mergeDebugJniLibFolders
:transformNative_libsWithMergeJniLibsForDebug
:processDebugJavaRes UP-TO-DATE
:transformResourcesWithMergeJavaResForDebug
:validateSigningDebug
:packageDebug
:assembleDebug
:cdvBuildDebug

BUILD SUCCESSFUL

Total time: 45.301 secs
Built the following apk(s):
        E:/Cordova/CordovaWindows/platforms/android/build/outputs/apk/android-de
bug.apk

• 運行項目
  • cordova run android
  • 運行之后提示 No target specified, deploying to device '192.168.237.101:5555'.

  這里我開了一個Genymotion模擬器靠娱，上面是分配的設備沧烈，當然用真機效果當然是最好的。

這時候已經(jīng)可以將platforms下的android導入Android Studio運行了像云，因為它已經(jīng)是一個獨立項目了

配置項目

前面在命令行操作有諸多不便锌雀，那么接下里既然項目都可以運行了蚂夕，那就可以直接去項目配置

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.jty.mycordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>MyCordova</name>
    <description>
        A sample Apache Cordova application that responds to the deviceready event.
    </description>
    <author email="521taoyuan@gmail.com" >
       TaoYuan
    </author>
    <content src="index.html" />
    <plugin name="cordova-plugin-whitelist" spec="1" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
</widget>