一、Ionic3在VS Code中的開發環境搭建
1.全局安裝Ionic包
npm install -g cordova ionic
使用 ionic -v指令,檢視是否安裝成功
![](https://img.laitimes.com/img/_0nNw4CM6IyYiwiM6ICdiwiIn5GcuMWZjJmZhdTO5ETM0kjY3MmYxE2YyYGN2EWO2QmZjNjMfdWbp9CXt92Yu4GZjlGbh5SZslmZxl3Lc9CX6MHc0RHaiojIsJye.png)
2.使用ionic start xxx 指令建立Ionic3項目
ionic start myApp tabs
注:tabs 是建立初始化項目類型,預設帶有tab頁模闆
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>
運作結果:
更多:
Apache Cordova開發環境搭建(二)VS CodeIonic建立項目失敗:[ERROR] Network connectivity error
occurred, are you offline?
Ionic2 相關文檔整理