4.4 Ionic项目模板目录结构简介
使用Ionic CLI的命令创建完一个项目并加入Android或iOS（开发机需要是OSX操作系统）运行平台的支持后，项目的目录与文件结构如图4.4所示。
图4.4 Ionic项目模板顶层目录与文件结构
本节将介绍重要的目录与配置文件，了解这些对于未来的问题定位与应用定制是有助益的。
4.4.1 常用工作目录www
www目录将是开发人员最常访问的地方，开发出的代码基本都归类放在相应的字母下。图4.5中显示了初始状态下www目录的结构。
图4.5 www目录的结构
相信读者根据名称不难想到：
● css、img和js目录分别放置开发人员自行开发的代码或图片资源。
● index.html是默认的应用的主页面文件，由于Ionic APP应用的实质是一个SPA（Single Page Application单页面应用），因此该文件将在运行时一直加载在浏览器中，而随着代码的运行（通过第8章介绍的导航类组件）变更其局部的展现。
● lib目录主要放置存放Ionic框架的源代码、图标字体文件和使用的AngularJS框架的代码。
4.4.2 常用工作目录scss
在项目启用了SASS后，scss目录下将会存在一个ionic.app.scss文件。开发人员可以在这个文件上更改Ionic默认设置的一些变量的值，该文件的头部已有注释文本举例该如何更改。读者可以结合在4.1节了解的SASS知识和/lib/ionic/scss目录下的Ionic原始SASS文件来定制自己的APP应用的外观。
4.4.3 常用工作目录resources
resources目录主要用于存放APP应用在Android和iOS平台的桌面图标和应用启动闪屏使用的图片文件。使用自己的资源覆盖这些文件是定制发布APP前必须要做的界面完善工作，一般来说这些图片文件是使用Photoshop来制作生成的。本书后面的13.3.9节里用实例介绍了实战项目中如何定制APP的图标和应用启动屏图片文件。
4.4.4 重要文件package.json
通过文本编辑器打开package.json可以看到APP应用的相关信息、依赖的Gulp插件和其他NPM开发包都设置在里面。此外还列举出了随应用模板安装的Cordova插件集和支持的硬件平台，如图4.6所示。
图4.6 package.json的初始结构
4.4.5 重要文件config.xml
config.xml是存放与APP应用发布相关的主要信息的配置文件。因为XML文件的自描述性，相信读者阅读每项的内容就能知道对应的配置项意义，也可以到cordova的官方网站（http://cordova.apache.org/docs/en/latest/config_ref/index.html）阅读更全面的说明。开发人员可以在发布测试时尝试调整里面的一些配置值，如SplashScreenDelay、FadeSplashScreenDuration。笔者建议调整其他开关值前在网上先搜索一下这些配置项对应的含义，以免产生意想不到的错误。
4.4.6 其他目录与文件简介
● hooks目录，放置安装的Cordova插件可能需要额外执行的脚本文件，Ionic CLI会负责调用。
● node_modules目录，存放项目用到的Nodejs插件模块。
● plugins目录，Cordova插件的安装目录，相关知识请完整参考本书第11章。
● gulpfile.js文件，项目的Gulp主文件，已在本书的4.3.6节介绍过。