Ionic 學習筆記 1-環境搭建

Ionic是什麼就很少說了，引用一段百度百科的介紹，以下

　　Ionic是一個用來開發混合手機應用的，開源的，免費的代碼庫。能夠優化html、css和js的性能，構建高效的應用程序，並且還能夠用於構建Sass和AngularJS的優化。ionic會是一個能夠信賴的框架。

網上已經有不少關於Ionic安裝的教程，差很少都大同小異，此文章主要是記錄本身Ionic學習的過程，和遇到的問題，有解決的，沒解決的，反正都是本人操做過的

全部步驟都是在Mac OS X系統下操做；

一、安裝Node.js ,這步沒問題，網上下載安裝就行了

二、安裝Cordova和Ionic

    終端輸入：sudo npm install -g cordova ionic   這個只要等待就行了自動完成的；

    默認安裝完後路徑是：/usr/local/bin

三、官網上說，如今就可使用了

    終端輸入：sudo ionic start myApp tabs  下載了一堆東西（每次創建新項目都會下載，這個感受有點擔憂，會不會哪天GFW了），建立成功，新建項目地址是在/usr/local/bin/myApp，默認是IOS Application；

四、一個最簡單的項目就搞好了，而後按官網說明編譯、模擬器運行；

     sudo ionic platform add ios  (由於默認已是IOS，因此能夠省略；若是是要編譯Android平臺，ios改android就行了)

　　sudo ionic build ios   這步也很正常，顯示**BUILD SUCCEEDED**

     sudo emulate ios   這步操做就不行了，能夠打開模擬器，可是App進不到模擬器裏面去；報錯：no such file or directory,stat '/users/apple/Library/logs/CoreSimulator/F9BF053E-FD55-42BC-A03C-2F2F3C804462/system.log ,提示很清楚，沒找到文件，由於Mac OS的模擬器不是很瞭解，暫時還沒解決，解決後再補充了；

五、在新建平臺和編譯以後，ionic會在/platforms/ios創建一個XCode的工程，用XCode打開就能夠編輯修改了，並且用XCode掛接模擬器是能夠正常運行的；

 

由於用ionic主要是爲了跨平臺，減小開發，天然想到還要編譯下android平臺的

一、sudo ionic platform add android   又是下載幾個包，正常完成

二、sudo ionic build android ,報錯了，Failed to find 'ANDROID_HOME' environment variable;顯然是環境變量沒設置，又折騰了下，把環境變量設置好；

    環境變量存放在.bash_profile文件裏，默認沒有，手工新建一個，文件裏輸入：

    export ANDROID_HOME=~/Document/ADT_SDK

    export PATH=${PATH}:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools

    終端裏輸入：sudo source ~/.bash_profile   讓它當即生效

   從新輸入sudo ionic build android，能夠了，又是下載一堆的東西

   輸入 sudo ionic emulate android 模擬器運行，可是報錯，提示:No emulator images(avds) found; 模擬器鏡像沒找到；好像是須要Api 21 的Image，沒肯定；

   而後我先手動開啓模擬器，再運行上面的指令就能夠了，另外API 17版運行界面混亂，API 22版運行良好