本文講的是android混合移動(dòng)開發(fā)環(huán)境搭建,IOS的環(huán)境配置以后再補(bǔ)吧。在開始之前,你需要配置好JDK,如果你自己寫后臺(tái),還需要配置tomcat等。這里用的開發(fā)工具是eclipse火星版,你也可以使用sublime或webstorm都可以,使用CLI把應(yīng)用裝在真機(jī)上調(diào)試,只是我更熟悉eclipse開發(fā)安卓應(yīng)用罷了。 安裝phonegap cordova ionic七步曲1、JDK的配置不提了,太LOW了,自己弄吧,我這里用的是JDK7。 http://www.androiddevtools.cn/
按照里面的方法配置好SDM的代理就可以更新SDK了,速度比墻外的快多了。我把SDK更新到23(android 6.0),目前在這個(gè)版本下開發(fā)。 把你需要的東西都下下來吧,還包括帶了ADT插件的eclipse(這個(gè)eclipse不是JEE版本的,對(duì)html,js不會(huì)感知變色,編輯起來不放便,但里面的plugins和features目錄下有對(duì)應(yīng)的插件,到eclipse官網(wǎng)上下個(gè)火星版,把插件拷進(jìn)去就可以了)。安裝ADT不要去弄什么官網(wǎng)的地址,神馬改hosts的,大多也不靈,別去折騰了,到上面地址里下離線的吧。 http://www.ionic.wang/
安裝 $ npm install -g cordova ionic
創(chuàng)建項(xiàng)目 $ ionic start myApp tabs
注意tabs是一個(gè)模板,創(chuàng)建的項(xiàng)目是tab頁的方式展現(xiàn)的。 $ cd myApp
$ ionic platform add ios
$ ionic build ios
$ ionic emulate ios或真機(jī)運(yùn)行ionic run
改成android就是android的平臺(tái)了。 從這里開始你的混合開發(fā)征程吧,一開始你就會(huì)體現(xiàn)到它的強(qiáng)大。 在瀏覽器環(huán)境調(diào)試程序我們不想每改一處代吧都在真機(jī)上跑一次,怎么辦呢,可以通過下面的命令啟動(dòng)項(xiàng)目,在瀏覽器里實(shí)時(shí)查看(導(dǎo)航到www目錄的外面): ionic serve
啟動(dòng)后他會(huì)自動(dòng)打開默認(rèn)瀏覽器查看網(wǎng)站,還會(huì)實(shí)時(shí)監(jiān)控www中文件的修改,因此你可以放心編碼了,最重要的是,你可以在谷歌瀏覽器里“審查元素”,查看實(shí)際生成的HTML和CSS,讓你深入地了解ionic組件。 安裝完ionic提示找不到命令的問題安裝完ionic后在CMD里運(yùn)行ionic -version提示找不到命令,可以把這個(gè)目錄配置到path環(huán)境變量里: C:\Users\your-user\AppData\Roaming\npm
ionic程序里的ajax跨域問題-CORS在真機(jī)上運(yùn)行時(shí),我們可以配置白名單,使ajax訪問成功,但通過ionic serve運(yùn)行時(shí),谷歌瀏覽器是不允許跨域訪問的,因此所有連網(wǎng)請(qǐng)求都失敗,怎么辦呢? http://localhost:8100
也就是把你ajax請(qǐng)求的地址投射到localhost:8100這個(gè)地址上去,就是你項(xiàng)目的origin,而這個(gè)origin就是ionic 的CLI,而我們知道只有客戶端環(huán)境會(huì)有跨域問題,對(duì)JAVA,C 這種語言是不存在跨域的,OK,找到你www目錄的上一層,有個(gè)ionic.project文件,打開他: 1 {
2 'name': 'app',
3 'app_id': '',
4 'proxies': [{
5 'path': '/api/forecast',
6 'proxyUrl': 'https://api./forecast/APIKEY/'
7 }]
8 }
好,在程序里這么訪問就OK了: 1 $http.get('/api/forecast/').success(function (forecast) {
2 $scope.forecast = forecast;
3 });
是不是很神奇? |
|