天天看點

Ionic3開發環境搭建-VS Code

原文: Ionic3開發環境搭建-VS Code

一、Ionic3在VS Code中的開發環境搭建

1.全局安裝Ionic包

npm install -g cordova ionic      

使用 ionic -v指令,檢視是否安裝成功

Ionic3開發環境搭建-VS Code

2.使用ionic start xxx 指令建立Ionic3項目

ionic start myApp tabs      

注:tabs 是建立初始化項目類型,預設帶有tab頁模闆

Ionic3開發環境搭建-VS Code

3.使用ionic serve 指令,運作項目

cd myApp
ionic serve      

使用 ionic/cordova platforms ls ---檢視支援的平台  

ionic/cordova platform add xxx ---安裝支援的平台

蘋果環境:

ionic platform add ios
ionic emulate ios      

安卓環境:

ionic platform add android
ionic run android      

4.使用VS Code 打開開項目,修改home頁面

注:在VS Code中編寫頁面方式,和開發Angular2一樣,點選儲存自動重新整理浏覽器。

<button ion-button color='light'>light</button>
  <button ion-button>預設按鈕</button>
  <!-- 日期控件 -->
  <ion-item>
    <ion-label>Start Time</ion-label>
    <ion-datetime displayFormat="h:mm A" pickerFormat="h mm A" >
    </ion-datetime>
  </ion-item>      
Ionic3開發環境搭建-VS Code

運作結果:

Ionic3開發環境搭建-VS Code

更多:

Apache Cordova開發環境搭建(二)VS Code

Ionic建立項目失敗:[ERROR] Network connectivity error

occurred, are you offline?

Ionic2 相關文檔整理