原文發表於我的技術博客
本文是「Ionic 入門與實戰」系列連載的第三章，主要對 Ionic 的項目結構作了介紹，並講解了Ionic 中的路由概念以及相關配置。
原文發表於我的技術博客
1. Ionic 項目結構
這是初始化創建的 Ionic 項目結構，接下來將一一講解。
因為 Ionic 使用了 Cordova 技術，所以項目的文件架構基本和 Cordova 的項目類似。
1.1 app 文件夾
項目文件夾，后續的代碼編寫都將在這里進行，因為使用的語言就是 HTML5/CSS(Sass)/JavaScript，所以項目結構類似於靜態網站的項目結構。
1.2 hooks 文件夾
hooks 文件夾 主要放置在提交給 Cordova 處理的時候，自定義的一些動作，主要用於一些自動化處理的動作，如在編譯前、編譯后、運行前等等時刻插入自己定義好的動作。具體的介紹可以查看其中包含的文件 README.md。
1.3 node_modules 文件夾
包含了所有使用 npm 安裝的依賴包。
1.4 platforms 文件夾
platforms 包含了 iOS 平台和 Android 平台的項目文件，一般不需要去修改，除非你需要修改一些原生的配置，如需要配置不同平台的推送通知的時候，才需要對其中的相關文件進行修改。
1.5 plugins 文件夾
存儲所有 Cordova 插件的位置，注意區別於 npm 安裝依賴包的位置。
安裝命令如下，{plugin} 是插件的 ID 或者 插件 GitHub 的 URL：
ionic plugin add {plugin}
1.6 resources 文件夾
放置了平台的圖標(icon)和啟動界面圖片(splash)，注意適配不同的分辨率，后續章節會作詳細介紹。
1.7 www 文件夾
獨立的項目，用於在瀏覽器調試時生成的文件夾，這樣項目生成的 cordova/ionic 等編譯文件將不在項目文件夾中存在，可以用於單純的 web 發布使用。具體的配置在下面的 ionic.project 文件中有詳細的介紹。里面的 index.html 是 app 的入口。
1.8 config.xml
項目整體配置，配置文件的節點和 Cordova 是一樣的，具體的節點解釋可以參見這里。
1.9 gulpfile.js
gulp 是一個基於流的自動化構建工具，文件中配置了項目編譯過程中執行的構建流事件。大型項目需要自動構建的時候才會去修改相關配置，一般不去修改即可。
1.10 ionic.config.js
配置用於執行 Ionic CLI 時候使用。
1.11 ionic.config.json
可以自定義配置值，供項目讀取。
1.12 ionic.project
除了基本信息的配置，還可以在其中添加一些外部的配置，如添加一個 Gulp Watch，用於實現 LiveReload。
"gulpStartupTasks": [
"watch"
],
"watchPatterns": [
"./scss/**/*.scss",
"./www/js/**/*.js",
"./www/build/index.html"
]
1.13 package.json
項目依賴的包在這里管理，如果項目中丟失或者初始化，使用 npm install 命令的時候，會加載此配置文件中的依賴包。
這里只是大概了解了每個文件夾、文件的作用，更多的使用方法將在接下來的實際項目中有詳細地講解。