1、ionic介绍

[JerryMissTom]

移动开发已经成为一股潮流，web开发者假如也想在此浪潮中冲浪的话，我推荐 ionic 这个跨平台的移动应用开发框架。它的口号是 Build amazing apps in one codebase, for any platform, with the web, 可以做到 write once, run anywhere。

ionic1 基于 angularjs，已经成为历史。前不久发布了 ionic4，做了很大的改动，最重要的一点就是使用了Stencil这个可以将自定义组件转为web Components 的编译器，鉴于这个版本暂时还是beta版本，不建议使用。

本系列的文章全部基于ionic3，底层的Angular使用5.x版本，以后都简称ionic，ionic3之前基于Angular 4.x版本，现在已经全面切换到Angular5.x了，大家开发的过程中注意甄别，因为 5.x和4.x之间还是有很多改动的。

ionic 的成功少不了Angular 和Cordova 的功劳。

Angular 是 Google 推出的前端开发框架，使用 TypeScipt 语言进行开发，适合规模大，多人配合的项目。

Cordova 脱胎于 Adobe 的 PhoneGap，后来其核心源码被捐给Apache ，改名为 Cordova ，是一个使用web技术的跨平台移动应用开发框架。

ionic 是 Angular 的一些核心开发者，将 Angular 与 Cordova 结合起来，并针对移动应用的特点进行改造，提供了丰富的UI组件的跨平台移动应用开发框架。同时，ionic也提供了命令行工具 ionic-cli ，功能强大，简单好用。

上图可以看出 Angular，Cordova 和 ionic 之前的关系。

个人认为 ionic 可以简单解释为成 Angular+Cordova 基础上的UI框架，它使用 Angular 开发，提供了精美的UI组件，通过Cordova plugin 与原生功能进行交互，最后借助 Cordova 命令打包成可以运行在不同平台上的App，当然也可以只使用 www 文件夹下的内容当做可以通过浏览器访问的 webApp 。

打包出来的Android App其实就是一个 WebView ，加载本地的www 文件夹中的网页。网页中可以调用 Native 功能就是通过 Cordova 这个桥梁。iOS同理。

ionic 不是简单的把 Angular 和 Cordova 结合在一起，也做了一些改造，使之更适合移动开发。首先，ionic 抛弃了 Angular 中的路由框架，而是实现了自己的堆栈式页面导航功能，通过简单的 push 和 pop方法，实现页面的跳转和返回，更符合移动开发习惯。其次，ionic 也针对 cordova native plugin写了配套的JS依赖包，使web开发者可以很快上手原生插件的使用。最后，ionic 提供了丰富的适合移动应用开发的UI控件，比如，DateTime，Toobar等常用的组件。

ionic 的缺点也是显而易见的，首先，性能，还是性能，安卓低端机上卡顿明显，用户体验很差。其次，虽然 ionic 提供了大部分常见的与原生进行交互的插件，但是假如你的需求很冷门，只能自己写一个，比如说支付。最后，使用 Angular 这个框架，学习曲线比较陡峭。

下图展示了应用打开的过程及以打开相机为例调用原生功能的流程，内容简单，不过多解释。

[im-Luxqi]

谢谢大佬