ionic3项目开发备忘录

辛苦的搞了一个月，终于开发并测试完了，但是突然项目停下来了，app被扼杀在摇篮之中。记录一下开发过程中的坑以及用到的知识，以备后用~

一. 环境搭建及创建项目

1. 安装Ionic and Cordova

npm install -g ionic cordova    如果报没有权限的错误，用 sudo npm install -g ionic cordova    如果还是报无权限sudo npm install -g --unsafe-perm ionic cordova

2.搭建项目

ionic start 项目名 模板名 。 模板有

* tabs : 简单的3个tab的布局
* sidemenu: 有侧边栏的布局
* blank:空的单页面
* super: starter project with over 14 ready to use page designs
* tutorial: a guided starter project

3.调试

(1)浏览器调试

直接用ionic serve,可以起服务

（2）andriod调试

配置JDK => 配置android sdk  =>执行ionic cordova platform add android添加平台 =》 手机打开开发者模式，usb连接电脑 =》执行cordova run android命令 =》 用chrome最新版本打开以下链接：chrome://inspect/#devices =》

按照上图配置之后，点击inspect

二.坑

1. ios 调用cordova 的camera，应用崩溃， 会报

This app has crashed because it attempted to access privacy-sensitive data without a usage description. The app's Info.plist must contain an ****（不同的权限错误不同） key with a string value explaining to the user how the app uses this data。 解决办法： 在xcode, info.plist中添加报出的相应权限

2. ionic3热更新

(1) 安装热更新插件，通过命令

npm install -g cordova-hot-code-push-cli

若报没有权限的错误，就用

sudo npm install -g cordova-hot-code-push-cli

输入自己的密码即可安装，如果还是报没有权限的错误 ，那就用

sudo npm install -g --unsafe-perm cordova-hot-code-push-cli

(2) 添加插件到项目中

cordova plugin add cordova-hot-code-push-plugin

cordova plugin add cordova-hot-code-push-local-dev-addon

(3)

执行cordova-hcp server

www目录下生成2个文件chcp.json和chcp.mainfest；chcp主要是插件的配置信息，chcp.mainfest是我们要更新文件的hash值对照表，如果app发现hash值表改变就会下载对应的文件来更新。
chcp.json需要修改成配置，配置如下

{
  "autogenerated": true,
  "release": "2017.08.20-08.54.01",
  "content_url": "http://www.yourserver.com/test/www",//更新远程库路径
  "update": "start"
}

其中content_url中的路径是你的服务器的地址

如果是在debug模式下尝试热更新，则可启用本地的服务器，以下是针对mac电脑

打开浏览器，输入127.0.0.1 网址，如果It works则说明有本地服务器，则打开网络看到

则可以将content_url："http://你的IP地址/www"

因为每次执行cordova-hcp build 都会重新生成chcp.json，为了避免每次都需要修改此文件，我们可以在app目录下新建cordova-hcp.json,内容如下：

{
  "autogenerated": true,
  "content_url": "http://你的IP地址/www",//更新远程库路径
  "update": "start"
}

这样每次执行cordova-hcp build的时候都会用这个文件去生成www下的chcp.json，免去每次都要修改的麻烦

(4) config.xml文件的widget节点加入

<chcp>
    <config-file url="http://你的IP地址/www/chcp.json" />
</chcp>

（5）修改.chcpenv文件

{
  "content_url": "http://你的IP/www",
  "config_url": "http://你的IP/www/chcp.json"
}

（6）执行ionic build，将你的app打包进www文件夹下

（7）执行cordova-hcp build将你的www文件复制

（8）将打包好的apk安装在手机

（9）修改src下的东西，然后再次执行ionic build，cordova-hcp build，将你的www文件复制进刚才目录。然后重新打开手机APP，会发现刚才的修改（有时候比较慢，需要等一会）

3. 内壳更新指的是热更新，用户不需要下载新的apk即可更新应用，适合一些小的修复，

手机打开App,会启动updateLoader, updateLoader会从config.xml中的config-file中获取url地址，从改url加载一段json配置，从该配置中取release版本号，与当前app中的版本号进行比对，如果不同的话就会从URL地址中获取chcp.manifest中的hash值，对发生变化的hash值进行热更新

4. 热更新的时候，打包的时候报

AndroidManifest.xml file is not found! Can't increase build version for android.

解决办法https://github.com/nordnet/cordova-hot-code-push/issues/336  将Android版本降为6.4.0