隨說(shuō) :我是第一次接觸這個(gè)框架,所以我就是一個(gè)小白,系列以我學(xué)習(xí)的角度去詳細(xì)列出我的過(guò)程,希望對(duì)你有所幫助
本人開(kāi)發(fā)環(huán)境 :
OS X EL Capitan v10.11.3
WebStorm v11.0.3
Xcode v7.3
項(xiàng)目涉及技術(shù) :
cordova+ionic+angryJS+springMVC+mybatis+nodeJS
1扭勉、安裝nodejs
注意選擇穩(wěn)定版
2皂冰、安裝cordova
輸入以下命令店展, 加上sudo保證擁有root權(quán)限
$ sudo npm install -g cordova
然后輸入密碼
下圖是,安裝過(guò)程秃流,過(guò)程可能有點(diǎn)久壁查,稍微需要等一下
3、 安裝ionic
$ sudo npm install -g cordova ionic
同樣輸入命令后剔应,要輸入密碼睡腿,然后等待安裝完成
等吧。
安裝過(guò)程中出現(xiàn)一個(gè)警告峻贮,可以選擇無(wú)視席怪,也可以選擇更新一下,要更新的話(huà)纤控,請(qǐng)執(zhí)行一下命令
$ sudo npm install minimatch@"3.0.2"
挂捻。。已經(jīng)是3.0.2了啊船万,無(wú)語(yǔ)
安裝完ionic 可以看一下版本
$ ionic -v
可以看到當(dāng)前ionic版本是 1.7.16
他提示我刻撒,強(qiáng)烈要求我安裝一下ios依賴(lài)庫(kù),那就裝
$ sudo npm install -g ios-sim
輸入 ionic 能看到更多命令
4耿导、建立一個(gè)ionic項(xiàng)目
有多種樣式声怔,請(qǐng)到官網(wǎng)看,我這里選擇tabs
請(qǐng)先cd到你需要存放的目錄執(zhí)行
$ ionic start myApp tabs
圖中的錯(cuò)誤
? (node:3290) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
是因?yàn)間raceful-fs 在 node V6 下不支持舱呻,需要降級(jí)
$ brew tap homebrew/versions
$ brew install homebrew/versions/node5
$ nodejs -v
如果安裝nodeJS的時(shí)候選擇較低版本的醋火,其實(shí)即可
建立后的新項(xiàng)目
因?yàn)槲沂窃趍ac下開(kāi)發(fā)的,所以我就先配置iOS版本
同樣箱吕,先CD到當(dāng)前項(xiàng)目目錄下
$ ionic platform add ios
執(zhí)行這一句之后稍微等一會(huì)芥驳,他會(huì)將文件打包成iOS項(xiàng)目
成功后,目錄多了一個(gè)ios文件夾
到這一步茬高,點(diǎn)擊HelloCordova.xcodeproj兆旬,就能用Xcode打開(kāi)項(xiàng)目了,然后就可以進(jìn)行開(kāi)發(fā)了
但是這里有兩個(gè)www的目錄怎栽,xocde讀取的是ios文件夾下的www文件夾里面的內(nèi)容丽猬,需要同步編譯一下
$ ionic build ios
然后再次編譯看效果