初识IONIC2

IONIC2及以上版本基础结构分析

背景介绍

ionic用于开发混合手机应用，一套代码可以同时编译生成对应的Android和IOS版本，有效节省了开发成本。比较适用于那些开发周期短，需要较短时间内进行上线的产品。但同时也会存在一些其他的问题，比如说效率和兼容性无法得到保证。

这里我主要介绍的是IONIC2及以上的版本，因为第二个版本开始与之前的版本有了极大的改变，整个目录结构和编码方式都有很大差异。有兴趣的可以先了解下Angular2，它是IONIC2的实现基础。

IONIC结构分析

作为程序猿，学习一门新技术总是要先从官网撸起，效果才是最好的，IONIC。

（这里自动忽略了安装环境等前戏步骤，毕竟这些随便百度下都有的）。

1.生成IONIC项目

ionic start [项目名]



对，你没有看错，生成一个完整的项目就是这么简单，这里还为开发者准备了各种版本，保证满足大部分人的需求。

2.运行项目

打开项目目录： cd [项目名]

浏览器运行项目：ionic serve



这里我选择的是blank模式，就只有一个空白的界面。直接使用浏览器进行调试，在我看来是最方便的。可以很直观的看到修改结果，不过如果你需要使用到手机的一些固件那就只能添加平台运行在手机上，而且还需要添加对应的插件，这个之后会再提。

3.观察项目结构

终于来到本篇的重点了，当然我本身是Android出身，如果有什么讲的错误的地方，也希望各位提出来，互相交流。

整体结构如下图：



我对一些比较重要的文件的理解

app.module.ts

4000



app.component.ts



各个page



以上是我最近对IONIC的一些使用体会，希望可以给其他人提供一些参考。