前一天準備下載下傳VS2015預覽版，到VisualStudio官網一看，發現微軟釋出了VisualStudio2013的插件——Visual Studio Tools for Apache Cordova，實作跨平台的開發。官網下載下傳位址：http://www.microsoft.com/en-us/download/details.aspx?id=42675，下面是截圖：
點選下載下傳擴充插件，輕按兩下開始安裝，第一次打開出現如下錯誤：
這個是缺少了Windows Management Framework 3.0,下載下傳位址：http://www.microsoft.com/en-us/download/details.aspx?id=42675，下載下傳後安裝，重新開機安裝程式即可。
安裝界面如圖，大家根據自己的電腦環境安裝，還要安裝Android SDK、Java環境、iTunes，這些建議都單獨安裝，網速不給力，還不知道安裝到什麼時候，其他的全選，點選next，完成安裝。不過，貌似微軟官方的ANdroid SDK包含了新的安卓模拟器，大家誰網速快，有時間，任性的，可以看看。我這裡用的是之前現在的Android SDK，是以模拟器還是舊的。
一、編寫Hello，world
打開VS2013，建立項目，選擇TypeScrip項目,如圖：
如果前面你都安裝成功的話，應該會看到以下界面：
有的會出現如下界面：
但是這個錯誤并不影響編譯，仍然可以編譯成功，直接關閉即可。
大家可以先看一下現在的項目結構，如圖：
看上去很像一個web項目，裡面可以看到Android、ios、windows、wp8等幾種應用。
由于我的電腦組態是AMD CPU + WIN7 64位系統，是以無法安裝蘋果虛拟機和WP8的模拟器(必須win8系統及以上)，這裡隻能示範Android模拟器的運作效果。大家有條件的可以試試。
既然要寫Hello，world，那麼打開index.html，我們看到如下代碼：
修改Hello，your ... is ready!為Hello，world即可。下面來看看如何運作：
我們可以看到調試選項很多，我們就用預設的第一個，後面說Android Emulator.點選運作，會看到打開谷歌浏覽器，如圖：
經過長久的等待，Android模拟器終于啟動了。來看看效果如何吧，如圖：
來看看應用的圖示是什麼，如圖：
是一個很難看的圖檔，由于項目面向的是三大移動平台，是以預設圖示不會是Android，我們來看看如何修改預設圖示。
如圖，替換掉對應目錄的圖檔即可，注意圖檔尺寸要一樣。我這裡也沒什麼好的圖示，就用預設Android的了。ios和wp8一樣，替換圖示即可。同理，替換對應圖檔，可以修改程式的啟動畫面，如圖：
二、引入BootStrap,建構APP
既然使用html + css + js進行開發移動應用，那麼一些第三方的css和js庫就是可以用的，下面來寫一個綜合的執行個體來看一下。如圖：
哈哈，看到了吧，BootStrap風格的按鈕。下面我們來看看添加了哪些代碼：
看到了吧，就像寫html頁面一樣，添加js方法，綁定即可。當然我們還可以看scripts下面的index.ts,還可以在裡面添加js代碼，實作點選事件的綁定,如圖：
看這個js代碼，是不是有種子產品化的感覺。并且在VS2013中，addEventListener方法，有很詳細的提示，如圖：
看到了吧，type:"click",就是單機事件，一共122個事件，我們可以選擇需要的進行綁定即可。
我又添加了一個html頁面，通過超連結來實作頁面跳轉，進而達到Android中類似Activity的切換。
項目部署到Android模拟器上後，會在debug目錄下面生成apk，我們可以安裝到自己的手機進行測試，我已經在自己的手機上面測試過，和在模拟器上面的效果相同。
關于更多的功能如何實作，我想大概和下面這些ts有關，開來還要學習一下TypeScript~~
三、生成ios和wp8
我們剛剛看了Android的開發流程，下面我們看看我們的項目如何釋出為其他平台的APP，在項目上面點選右鍵，打開項目屬性視窗：
點選配置管理器按鈕，打開配置管理器，我們選擇ios，點選确定，如圖：
接下來，我們看到調試選項變成了如下清單：
為了看到明顯的效果，我們選擇Ripple-iPad3,運作，如圖：
是個iPad的畫面吧，突然發現這裡發現按鈕還可以點選，不過彈出的消息框都在網頁裡面。大家有iPhone的可以真機測試一下。
總結：
用Html + Js + Css來開發移動端APP，可以将現有的前端架構用到移動端的APP中，如AngularJS、BackboneJS和JQuery，當然還有BootStrap，進而UI的開發和設計變的十分簡單和靈活。在VS2015中，微軟除了 Apache Cordova，還提供了Xamarin的跨平台方案，大家可以試一試。
關于項目的測試，如果大家用的Intel的CPU和win8系統，可以安裝蘋果虛拟機，在蘋果虛拟機上安裝ios的模拟器進行測試。win8系統可以安裝WP8模拟器，當然支援Android，這樣就實作了多平台的開發和測試環境。
可能有人會說這樣開發的APP性能不好，但是APP是在用戶端上面運作的，慢那麼一點又有什麼關系，又不是在伺服器上面，存在大通路量，要處理大資料。當然做遊戲開發，有專業的遊戲引擎，還用不到這個。
如果大家感覺這篇文章寫的不錯，請點個贊，給我協作的動力。歡迎大家可以加入到下面的QQ群進行讨論和學習。
在這裡提前祝大家平安夜快樂！
QQ交流群：243633526
部落格位址：http://www.cnblogs.com/yunfeifei/
聲明：本部落格原創文字隻代表本人工作中在某一時間内總結的觀點或結論，與本人所在機關沒有直接利益關系。非商業，未授權，貼子請以現狀保留，轉載時必須保留此段聲明，且在文章頁面明顯位置給出原文連接配接。
如果大家感覺我的博文對大家有幫助，請推薦支援一把，給我寫作的動力。