1. 背景
HyBrid app(混合模式移動應(yīng)用)是介于web-app和native-app之間的app, 兼具了Nativa App良好的用戶體驗和Web App垮平臺開發(fā)的優(yōu)勢。
2. 什么是Ionic
2.1 了解NPM
在使用Ionic之前需要先了解下NPM:nodejs的出現(xiàn)算是前端里程碑的是一個事件,它讓前端工程師們擺脫了瀏覽器的束縛,踏上了一個更加寬廣的舞臺。隨著一系列基于nodejs的應(yīng)用和工具的出現(xiàn),包管理扮演者很重要的作用。NPM(node package manager),作為node的包管理工具,極大的方便了我們的開發(fā)工作,主要作用包括:安裝、卸載、更新、查看、搜索、發(fā)布等。
NPM官網(wǎng):https://npmjs.org/
NPM官方文檔:https://npmjs.org/doc/README.html
2.2 Ionic
Ionic (即ionicFramework)是一個輕量的手機UI庫,具有速度快,界面現(xiàn)代化、美觀等特點。為了解決其他一些UI庫在手機上運行緩慢的問題,它直接放棄了IOS6和Android4.1以下的版本支持,來獲取更好的使用體驗。
ionic中文教程
3. 安裝Ionic
3.1 安裝node.js
在終端中查看node版本,

如果沒有安裝過或版本過低,則需要 Nodejs官網(wǎng) 下載最新的版本。
3.2 安裝ionic和cordova
由于國內(nèi)防火墻的原因,需要采用淘寶NPM鏡像才能成功安裝ionic包和cordova包。依次在終端中依次輸入以下兩個命令, 然后請耐心等候安裝成功。
npm install -g cnpm --registry=https://registry.npm.taobao.org
sudo cnpm install -g cordova ionic
3.3 創(chuàng)建ionic項目
cd ./Desktop // 終端進入桌面
ionic start demo_1 // 創(chuàng)建demo_1項目

3.4 創(chuàng)建iOS應(yīng)用
cd demo_1
ionic platform add ios
ionic build ios
ionic emulate ios // 打開模擬器
生成的iOS應(yīng)用在platform文件中顯示

3.5 運行iOS應(yīng)用
點擊demo_1.xcodeproj打開應(yīng)用,可以看到界面就像原生app那么炫酷了。
