參考文檔/資源
- To
美工：開發(fā)人員與美工的配合工作，請(qǐng)查看： - Theming Ionic Apps
- Components
- ionicons
- 使用自定義icon
- To
開發(fā)人員： - ionic官方文檔
- ionic CLI
- Angular官方文檔
- Angular架構(gòu)
- Angular組件通訊
- Angular DI
- TypeScript文檔
- cordova文檔
- ionic遠(yuǎn)程調(diào)試
- ionic多首頁(yè)-DeepLinker
分享大綱
ionic 技術(shù)架構(gòu)
ionic技術(shù)架構(gòu)
ionic 安裝
Requirement
Node.js 6-
xCode（非必需，只在運(yùn)行iOS模擬器時(shí)需要） -
Android SDK/JDK（非必需，只在運(yùn)行Android模擬器時(shí)需要）
安裝
$ npm install -g ionic cordova
創(chuàng)建ionic項(xiàng)目
// 創(chuàng)建一個(gè)項(xiàng)目，名稱為：cutePuppyPics；--v2表示使用ionic2；默認(rèn)會(huì)以`tutorial`為模板來創(chuàng)建項(xiàng)目，可修改。
$ ionic start cutePuppyPics --v2
tutorial項(xiàng)目分析
開發(fā)工具的選擇
瀏覽器調(diào)試
// -c表示打印客戶端日志，-s表示打印服務(wù)端日志。
$ ionic serve -c -s
項(xiàng)目的文件結(jié)構(gòu)
├── node_modules # 第三方庫(kù)
├── platforms # android/ios工程目錄
│ ├── android
│ └── ios
├── plugins # native插件
│ ├── cordova-plugin-console
│ ├── cordova-plugin-device
│ ├── cordova-plugin-splashscreen
│ ├── cordova-plugin-statusbar
│ ├── cordova-plugin-whitelist
│ └── ionic-plugin-keyboard
├── resources # android/ios資源文件，如：app icon, 啟動(dòng)頁(yè)面
│ ├── android
│ └── ios
├── src # 業(yè)務(wù)邏輯代碼目錄，大部分時(shí)間我們都跟它打交道
│ ├── app # App級(jí)別代碼目錄
│ ├── assets # 資源文件目錄，如：圖片/字體
│ ├── pages # 頁(yè)面存放目錄
│ └── theme # 公共樣式
└── www # typescript編譯后的目錄，可直接放到web服務(wù)器上
├── assets
└── build
命名規(guī)范
App的入口
main.dev.ts -> app.module.ts -> app.component.ts
page跳轉(zhuǎn)
iOS模擬器調(diào)試
$ ionic emulate ios
