cordova使用入门教程

2018-03-29 本文已影响0人杨晨1994

Apache Cordova是一个开源的移动开发框架。允许你用标准的web技术-HTML5,CSS3和JavaScript做跨平台开发。应用在每个平台的具体执行被封装了起来，并依靠符合标准的API绑定去访问每个设备的功能，比如说：传感器、数据、网络状态等。如果你想做app而又不想请原生工程师，那么这是一个不错的选择，话不多说我们接下来开启cordova学习之路

1.首先你需要安装一个node https://nodejs.org/en/download/ node下载地址下载安装一下就可以了

查看node版本

    node -v

image.png

现在node已经安装成功了

2.接下来需要安装cordova,打开命令行输入

   npm install -g cordova

安装完输入

    cordova -v

现在cordova已经安装成功了

3.安装完cordova就可以开始你的第一个项目了,找到你的工作文件夹，接下来创建一个名字为testdemo的文件夹，项目名字为TestDemo,包名为com.yourname.testdemo的Cordova项目，然后进入到项目

    cordova create testdemo com.yourname.testdemo TestDemo
    cd testdemo

4.这个时候你的项目已经创建完毕，你需要安装ios和android平台

安装ios平台，你需要一个xcode，之后的打包也是需要的

   cordova platform add ios

安装android平台

cordova platform add android
//这里安装平台的时候是安装的最新平台  最新平台修改了目录结构 但是大部分插件都没有修改 所以我建议大家安装6.3.0以下的平台
cordova platform add android@6.2.3 用来指定平台版本

5.添加安卓环境需要安装java jdk 和安卓SDK

JAVA JDK

安装[JAVA JDK]
地址：http://www.oracle.com/technetwork/java/javase/downloads/index.html)
我们可以看到下方有两个JAVA JDK 一个是是最新版的一个不是最新的
我安装了最新版的以后（并且配置了环境变量在cordova build android的时候报了错误，大概意思是版本不支持我卸载了最新版的下载了第二个也就是 Java SE 8u171/8u172 然后就可以了这里有个小坑）
image.png

安装完成以后我们打开命令行输入JAVAC 可以看到如下图不是内部命令是因为我们没配置环境变量

1524300052(1).png

打开我的电脑--属性--高级--环境变量
(1).新建系统变量JAVA_HOME，变量名：JAVA_HOME ，变量值：C:\Program Files\Java\jdk1.8.0_171
(2).新建系统变量CLASSPATH，变量名：CLASSPATH ，变量值：.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;
(3).选择“系统变量”中变量名为“Path”的环境变量，双击该变量，在原来变量后追加 %JAVA_HOME%\bin
(4).选择“系统变量”中变量名为“Path”的环境变量，双击该变量，在原来变量后追加 %JAVA_HOME%\jre\bin

我们再次打开命令行输入“JAVAC”，输出帮助信息即为配置正确。如图：

1524300487(1).png

ANDROID SDK

安装[ANDROID SDK]
下载Android Studio并安装（官方文档说仅安装 Android Stand-alone SDK 也可。但是我试过并不可以，会出下面的错误说你没有 gradle）
T$FK51TG57I(PYG5P7A4C{B.png
打开android studio 点击file/settings/appearance&behavior/system settings/android SDK 在这里可以看到你的SDK地址把它复制下来
1524377624(1).png
2 打开我的电脑--属性--高级--环境变量
新建系统变量ANDROID_HOME，变量名：ANDROID_HOME ，变量值：你刚才复制的内容
在path环境变量加追加：
%ANDROID_HOME%\tools
%ANDROID_HOME%\platform-tools
3 打开命令行输入adb 出来信息就可以了
PS：我第一次运行cordova build android 可以看到正在下载gradle 如下图
1524375663(1).png
PS：然后我安装的平台是 7.0.0 可以看到需要android-26支持但是我安装的27
1524378052(1).png
image.png
这个时候我们如果打包的话就会报错了
1524378231(1).png
还有就是我们现在用安卓7.0.0的平台的话有些插件是安装不了的如果需要安装插件的话就要降低android版本我这里用的是android6.2.3 需要的是android-25
那么我们就去下载一下SDK吧把你需要的勾选上然后点击OK就可以了
1524378428(1).png
PS：如果你安装了androidstuido 还是包gradle的错误那你需要手动去下载
gradle-x.x-bin.zip （x.x代表版本）
根据需要下载某一版本
地址：
(https://services.gradle.org/distributions)
添加环境变量

    PATH=D:\gradle-x.x\bin

关闭cmd或powershell窗口
重新打开，输入gradle -v，查看gradle安装成功与否

6. 查看平台，删除平台

cordova platforms list
cordova platform rm 平台名字

7.删除插件安装插件

   cordova plugin rm 插件名字
   cordova plugin add 插件名字

8. QQ登录微信登录支付宝支付 crosswalk插件以下插件是我经常用到的

     //YOUR_QQ_APPID, YOUR_WECHAT_APPID, your AppId 是你在QQ互联 微信开放平台 以及支付宝申请的appid
     1.QQ登录 cordova plugin add cordova-plugin-qqsdk --variable QQ_APP_ID=YOUR_QQ_APPID
     2.微信登录 cordova plugin add cordova-plugin-wechat --variable wechatappid=YOUR_WECHAT_APPID
     3.支付宝支付 cordova plugin add cordova-plugin-alipay-v2 --variable APP_ID=[your AppId]
     4.crosswalk插件 cordova plugin add cordova-plugin-crosswalk-webview   
     5.在android目录下assects目录下添加一个没有后缀名的文件 名字是xwalk-command-line  内容是xwalk --ignore-gpu-blacklist
     6.在打包的时候 如果两个程序包名一样 不安装cordova-plugin-crosswalk-webview   插件的APK是不能覆盖安装有此插件的APK
     7.版本插件 cordova plugin add cordova-plugin-app-version 
     8.启动页插件  cordova plugin add cordova-plugin-splashscreen
     9.获取手机Mac地址 cordova plugin add com-badrit-macaddress
     10.系统插件  cordova plugin add cordova-plugin-device
      11.系统键盘插件 cordova plugin add ionic-plugin-keyboard
      11.字体插件cordova plugin add cordova-plugin-fonts

如果你需要其他的插件可以到 http://cordova.axuer.com/plugins/ 里面搜索里面还有js代码直接复制粘贴就可以

9. 解决Could not resolve org.xwalk:xwalk_core_library:23 .打包失败问题

参考地址 https://stackoverflow.com/questions/36654990/error-building-xwalk-with-cordova-android
打开platforms\ android \ cordova-plugin-crosswalk-webview \ eqp-xwalk.gradle
把这个：

    dependencies {
         xwalkSpec
    }

改为这一个：

    dependencies {
         compile 'org.xwalk:xwalk_core_library:23.53.589.4' //xwalkSpec
    }

10.解决 In <declare-styleable> FontFamilyFont, unable to find attribute android:font 抱错

1527662814(1).png

打开打开platforms\ android \build.gradle
在 dependencies {...}代码下面添加以下代码

// ADDED THESE LINES
configurations.all {
  resolutionStrategy.force 'com.android.support:support-v4:26+'
}

参考地址 https://www.e-learn.cn/content/wangluowenzhang/29664

11.cordova各个文件

项目的文件

image.png

hooks文件夹没有什么用不可以改动
node_nodeule文件夹不可以改动
platforms文件夹是你的平台代码
plugins文件夹里面是一些插件
res是你存放icon和启动页的文件夹
www里面就是你的代码啦
.npmignore文件时忽略文件没用
build.json是我写的json文件下面介绍打包的时候再提
config.xml这个文件是最重要的里面是一些配置信息
package.json和package-lock.json不用动是自动生成的配置文件
release-key.keystore文件是打包正式安装包的需要的签名文件

12.cordova里面的config.xml

<?xml version='1.0' encoding='utf-8'?>
//这里的id是你创建项目的时候写的包名 可以随便写 但是还是语义化一点比较好
//如果是ios平台这个是bundle_id bundle_id是在苹果开发者中心申请的，不可以随便写 必须填写你申请的
//包名和bundle_id是判断你APP的唯一标识
<widget id="com.yourname.testdemo" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    //app名称
    <name>TestDemo</name>
    //app描述  填不填都可以
    <description>
        cordova demo
    </description>
    //作者
    <author email="141204xxxx@qq.com" href="http://cordova.io">
        MY TEAM
    </author>
    //这里是你的app页面入口 也就是在WWW文件夹下的html 
    //比如你想定入口在html文件夹下的guide.html 应该填写html/guide.html
    <content src="index.html" />
    //下面的没有研究 自带的
    <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:*" />
        //icon app图标  在res文件夹下
        <icon density="ldpi" src="res/icon/android/36.png" />
        <icon density="mdpi" src="res/icon/android/48.png" />
        <icon density="hdpi" src="res/icon/android/72.png" />
        <icon density="xhdpi" src="res/icon/android/96.png" />
        <icon density="xxhdpi" src="res/icon/android/144.png" />
        <icon density="xxxhdpi" src="res/icon/android/192.png" />
        //icon app图标  在res文件夹下
        <splash density="land-hdpi" src="res/screen/android/800-480.png" />
        <splash density="land-ldpi" src="res/screen/android/320-200.png" />
        <splash density="land-mdpi" src="res/screen/android/480-320.png" />
        <splash density="land-xhdpi" src="res/screen/android/1280-720.png" />
        <splash density="port-hdpi" src="res/screen/android/480-800.png" />
        <splash density="port-ldpi" src="res/screen/android/200-320.png" />
        <splash density="port-mdpi" src="res/screen/android/320-480.png" />
        <splash density="port-xhdpi" src="res/screen/android/720-1280.png" />
    </platform>
    //这是一些配置
    //app强制竖屏portrait 横屏是landscape
    <preference name="orientation" value="portrait" />
    <preference name="SplashScreen" value="screen"/>
    <preference name="SplashScreenDelay" value="0"/>#显示时间
    <preference name="AutoHideSplashScreen" value="false"/>#禁止自动隐藏
    <preference name="FadeSplashScreen" value="false"/>#禁用淡出效果
    <preference name="SplashMaintainAspectRatio" value="true" />#图像cover屏幕
    <preference name="ShowSplashScreenSpinner" value="false" />#隐藏加载灰圈
    <preference name="SplashShowOnlyFirstTime" value="false" />#每次重新启动都显示
    //Fullscreen设置程序是否全屏。全屏时状态栏将不可见，默认为false显示状态栏。
    <preference name="Fullscreen" value="false" />
    //info.plist文件配置信息   在ios平台才需要  不然在iTunes content上传构建版本的时候会被拒绝
   //我就被拒绝过 邮件内容是The app's Info.plist must contain an NSPhotoLibraryUsageDescription key with a string value explaining to the user how the app uses this data
    <edit-config file="*-Info.plist" mode="merge" target="NSCameraUsageDescription">
        <string>允许访问用于上传和发送照片</string>
    </edit-config>
    <edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryUsageDescription">
        <string>允许访问用于上传和发送照片</string>
    </edit-config>
    <edit-config file="*-Info.plist" mode="merge" target="NSLocationWhenInUseUsageDescription">
        <string>允许访问位置信息</string>
    </edit-config>
    <edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryAddUsageDescription">
        <string>允许访问用于上传和发送照片</string>
    </edit-config>
    //插件信息
    <plugin name="cordova-plugin-whitelist" spec="^1.3.2" />
    <plugin name="cordova-plugin-alipay-v2" spec="0.0.4">
        <variable name="APP_ID" value="[xxxxxxxxxxx]" />
    </plugin>
    <plugin name="com-badrit-macaddress" spec="https://github.com/mohamed-salah/MacAddress.git" />
    <plugin name="cordova-plugin-wechat" spec="^2.1.0">
        <variable name="WECHATAPPID" value="xxxxxxxxxxxx" />
    </plugin>
    <plugin name="cordova-plugin-qqsdk" spec="^0.9.6">
        <variable name="QQ_APP_ID" value="xxxxxxxxxx" />
    </plugin>
    <plugin name="cordova-plugin-crosswalk-webview" spec="^2.4.1">
        <variable name="XWALK_VERSION" value="23+" />
        <variable name="XWALK_LITEVERSION" value="xwalk_core_library_canary:17+" />
        <variable name="XWALK_COMMANDLINE" value="--disable-pull-to-refresh-effect" />
        <variable name="XWALK_MODE" value="embedded" />
        <variable name="XWALK_MULTIPLEAPK" value="true" />
    </plugin>
    <plugin name="cordova-plugin-device" spec="^2.0.1" />
    <plugin name="cordova-plugin-splashscreen" spec="^5.0.2" />
    <plugin name="cordova-plugin-app-version" spec="^0.1.9" />
    <plugin name="cordova-plugin-camera" spec="^4.0.2" />
    <plugin name="cordova-plugin-compat" spec="^1.2.0" />
   //平台版本
    <engine name="android" spec="^6.2.3" />
</widget>

13. 解决ios状态栏被覆盖问题修改Class文件夹 MainViewController.m

因为测试的时候发现苹果5状态栏被覆盖了所以修改以下代码
把

- (void)viewWillAppear:(BOOL)animated
{
    // View defaults to full size.  If you want to customize the view's size, or its subviews (e.g. webView),
    // you can do so here.

    [super viewWillAppear:animated];
}

替换为

    - (void)viewWillAppear:(BOOL)animated
{
    // View defaults to full size.  If you want to customize the view's size, or its subviews (e.g. webView),
    // you can do so here.
    if([[[UIDevice currentDevice]systemVersion ] floatValue]>=7)
    {
        CGRect viewBounds=[self.webView  bounds];
        viewBounds.origin.y=20;
        viewBounds.size.height=viewBounds.size.height-20;
        self.webView.frame=viewBounds;
    }
    [super viewWillAppear:animated];
}
-(void)viewWillDisappear:(BOOL)animated
{
 
    if([[[UIDevice currentDevice]systemVersion ] floatValue]>=7)
    {
        CGRect viewBounds=[self.webView  bounds];
        viewBounds.origin.y=20;
        viewBounds.size.height=viewBounds.size.height+20;
        self.webView.frame=viewBounds;
    }
    
    [super viewWillDisappear:animated];
}

14. 解决ios页面上下滚动问题把以下代码添加到config文件

    <preference name="WebViewBounce" value="false" />
    <preference name="DisallowOverscroll" value="true" />

15. android项目在config文件里修改包名的时候一定要删除平台再安装一次

16. ios项目每一次打包都需要删除平台再安装一次防止代码没有更新

17.打包debug APK android

打开命令行 cd到你的项目中

    cordova build android

image.png

这样打包就成功了红圈的地方是你的安装包地址因为我用了crosswolk插件所以会有两个安装包你们用armv7就可以

18.打包正式包

PS：上一步是debug安装包是测试用的签名是自生成的不可以用来正式发布的因为他的签名是根据电脑生成的也就是说你换了电脑就不能用了正式安装包有签名文件也就是前面说的keystore文件为你的安装包生成签名只要keystroe文件一样你的签名就不会变化
PS: 包名是APK的唯一标识用来识别是不是同一个APK 而签名呢我的理解代表的开发者包名一样的可以覆盖安装包名不一样的不可以覆盖安装

//首先生成一个keystroe签名文件  这个keystroe不能丢失要保存好 我上次试了一次重新生成keystroe文件结果发现文件不同
keytool -genkey -v -keystore release-key.keystore -alias cordova-demo -keyalg RSA -keysize 2048 -validity 10000
//上面的命令意思是，生成一个 release-key.keystore 的文件，别名（alias）为 cordova-demo 。（validity）期限10000天
//过程中会要求设置 keystore 的密码和 key 的密码。我们分别设置为 123456 和 123456。这四个属性要记牢，下一步有用。
//生成一个正式安装包
cordova build android --release
//对这个安装包签名
jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore release-key.keystore platforms/android/build/outputs/apk/android-armv7-release-unsigned.apk mgc
//为了以后不必这么麻烦 我们可以在项目中创建一个json文件  前面提到的build.json文件
{
  "android": {
    "release": {
      "keystore": "release-key",//keystroe文件名
      "alias": "cordova-demo",//项目别名
      "storePassword": "123456",//密码
      "password": "123456"//密码
    }
  }
}
下次就可以直接用 cordova build --release 了。

image.png

我们可以看到它调用了你的build.json文件和你的keystore文件会直接给你生成一个签好名的正式安装包了
文章推荐：https://segmentfault.com/a/1190000005177715 这个感觉更详细一些

19.最痛苦的来了打包苹果安装包 ipa 文件

下面是mac上打包ios包的步骤（从申请账号到app store应用上架）

1. 申请ios开发者账号

开发者账号分类

6788994-041bd44dd3065f8b.png

如果是个人账号发布的应用，App Store开发者的位置显示的是开发者个人的名字，而公司账号则可以显示公司的名字，现在App Store上的应用一般都是公司账号。

企业账号比较特殊，发布的安装包可以安装到任何设备上，但是不能发布到App Store。一般一些企业内部的应用都使用这种账号，想开发什么就开发什么，不用担心苹果审核机制的问题。

接下来的账号申请，参考https://www.jianshu.com/p/9b994a019ee6 很详细。

到这里账号已经申请下来了，我的是$99的公司级开发账号。

2. 打开苹果开发网站 https://developer.apple.com/ ，点击Account，登录你的开发者账号

3. 进入 Certificates, Identifiers & Profiles

4. 添加证书

6788994-580cb124448d2359.png

6788994-90c1c835d95fe1de.png

这四个证书是一个一个添加的，如果你的app 有推送则需要弄添加那两个推送的证书，没有就不用管，只添加那两个app发布证书即可。

两次continue之后，看到如下图界面 choosefile

6788994-32bf564088ce2467.png

接下来回到桌面，打开钥匙串，获取CSR文件。

6788994-0dacdc0af2efc91a.png

6788994-eae345b11286ddc9.png

继续后，有弹框提示存储位置，存在能找到的地方后回到刚才请求发布证书的页面，choose file 选择刚才的文件，然后点击continue。然后如下如界面，点击download，下载下来后找到该文件，双击，则自动添加到你电脑的钥匙串中了。

6788994-c7fc4fa2582ea03d.png

5.创建App IDs和绑定你的App的BundleIdentifier

6788994-8988d4171137ed39.png

6788994-9ec70ccea9f0b54f.png

注：你填写的bundle ID 有可能已经被注册过了，那么你需要自行修改一个，但如果这里改了，记得代码的config.xml文件里也要改！

下面勾选上你app用到的服务，比如推送，没有的话直接下一步下一步就好。

6788994-638b813627da4452.png

6.生成描述文件（描述文件的作用就是把证书和BundleIdentifier关联起来）

6788994-456201b1dcda06d9 (1).png

1524102088(1).png

这里我们先选 Ad Hoc 选择APPid

1524102253(1).png

选择你创建好的证书

1524102253(1).png

因为我们选的是 Ad Hoc 这个是为测试设备创建的也就是说我们需要选择udid 这个udid可以在devices里面添加这有添加了你手机的udid之后，你的手机才可以安装APP

1524102492(1).png

然后是上传到APP strore 的描述文件，没有截图了，口述吧：

  a) 还是先选择 app id

  b) 选择你刚创建的发布证书

  c) 在Profile Name栏里输入一个文件名字 下载下来 ,双击，就自动添加到你电脑的钥匙串中了。这里必须要放到钥匙串中不然你是用不了得

7. 将在windows上写的代码移植到mac上，通过拷贝或者git下载。放入到www文件夹下

8.打开命令行进入到你的项目然后重新平台安装平台（为保证代码得到更新）

QQ图片20180419152855.png

9.然后进入到你的项目文件夹邮件以Xcode打开platforms/ios/xxxx.xcodeproj文件

QQ图片20180419154210.jpg
10.接下来我们配置一下基础信息就可以打包了（我也不是搞IOS开发的配置可能不太详细或者什么地方有误）我是参考的这篇文章https://www.jianshu.com/p/749322c7b01a 大家可以看一下

QQ图片20180419155024.png

1 Display Name 是你的项目名称在config.xml写好的
2 Bundle identifier 是你的在开发者中心申请的在config.xml写好的
3 version build 是你的版本信息在config.xml写好的
4 上面的信息是我在config文件里面配置好的自动带过来的
5 sign（debug）和sign（release）选择你下载好的描述文件
5 xcode 8.0以后点击Signing 小方块选项可以自动配置你的证书
6 打包时上面的小锤子一定要选择Generic iOS Device

QQ图片20180419155940.jpg

7 如果你的app需要什么照相机但是提示是英文的你可以点击info 把其中的English改为China
8 接下来我们可以点击上面的product/Archive 进行打包了
这里我们可以选择导出或者上传到APPstore（Export或者Upload to APP Store）
9 当我们导出的时候弹出下面的图第一个是导出上传 APP Store的包第二个则是你的设备测试包也就是你添加的udid的手机可以安装测试的

QQ图片20180419161126.jpg

还记不记得下面这张图

1524102088(1).png

你选择的描述文件时上传APP Store的你就导出APP Store的包
你选择的是Ad Hoc的描述文件你就导出Ad Hoc的包

PS：https://icon.wuruihong.com/ 一个一键生成各种尺寸网站

cordova使用入门教程

1.首先你需要安装一个node https://nodejs.org/en/download/ node下载地址下载安装一下就可以了

2.接下来需要安装cordova,打开命令行输入

3.安装完cordova就可以开始你的第一个项目了,找到你的工作文件夹，接下来创建一个名字为testdemo的文件夹，项目名字为TestDemo,包名为com.yourname.testdemo的Cordova项目，然后进入到项目

4.这个时候你的项目已经创建完毕，你需要安装ios和android平台

5.添加安卓环境需要安装java jdk 和安卓SDK

6. 查看平台，删除平台

7.删除插件安装插件

8. QQ登录微信登录支付宝支付 crosswalk插件以下插件是我经常用到的

9. 解决Could not resolve org.xwalk:xwalk_core_library:23 .打包失败问题

10.解决 In <declare-styleable> FontFamilyFont, unable to find attribute android:font 抱错

11.cordova各个文件

12.cordova里面的config.xml

13. 解决ios状态栏被覆盖问题修改Class文件夹 MainViewController.m

14. 解决ios页面上下滚动问题把以下代码添加到config文件

15. android项目在config文件里修改包名的时候一定要删除平台再安装一次

16. ios项目每一次打包都需要删除平台再安装一次防止代码没有更新

17.打包debug APK android

18.打包正式包

19.最痛苦的来了打包苹果安装包 ipa 文件

猜你喜欢

热点阅读

cordova使用入门教程

1.首先你需要安装一个node https://nodejs.org/en/download/ node下载地址 下载安装一下就可以了

2.接下来需要安装cordova,打开命令行输入

3.安装完cordova就可以开始你的第一个项目了,找到你的工作文件夹，接下来创建一个 名字为testdemo的文件夹，项目名字为TestDemo,包名为com.yourname.testdemo的Cordova项目，然后进入到项目

4.这个时候你的项目已经创建完毕，你需要安装ios和android平台

5.添加安卓环境 需要安装java jdk 和安卓SDK

6. 查看平台，删除平台

7.删除插件 安装插件

8. QQ登录 微信登录 支付宝支付 crosswalk插件 以下插件是我经常用到的

9. 解决Could not resolve org.xwalk:xwalk_core_library:23 .打包失败问题

10.解决 In <declare-styleable> FontFamilyFont, unable to find attribute android:font 抱错

11.cordova各个文件

12.cordova里面的config.xml

13. 解决ios状态栏被覆盖问题 修改Class文件夹 MainViewController.m

14. 解决ios页面上下滚动问题 把以下代码添加到config文件

15. android项目在config文件里修改包名的时候一定要删除平台再安装一次

16. ios项目每一次打包都需要删除平台再安装一次 防止代码没有更新

17.打包debug APK android

18.打包正式包

19.最痛苦的来了 打包苹果安装包 ipa 文件

猜你喜欢

热点阅读

1.首先你需要安装一个node https://nodejs.org/en/download/ node下载地址下载安装一下就可以了

3.安装完cordova就可以开始你的第一个项目了,找到你的工作文件夹，接下来创建一个名字为testdemo的文件夹，项目名字为TestDemo,包名为com.yourname.testdemo的Cordova项目，然后进入到项目

5.添加安卓环境需要安装java jdk 和安卓SDK

7.删除插件安装插件

8. QQ登录微信登录支付宝支付 crosswalk插件以下插件是我经常用到的

13. 解决ios状态栏被覆盖问题修改Class文件夹 MainViewController.m

14. 解决ios页面上下滚动问题把以下代码添加到config文件

16. ios项目每一次打包都需要删除平台再安装一次防止代码没有更新

19.最痛苦的来了打包苹果安装包 ipa 文件