Ionic2 開發環境搭建

石曼迪發表於2016-10-17

Ionic2開發環境要求:

Nodejs

V4.5.0

Nodejs自帶

Npm

V2.15.9

同上

Ionic

V2.1.0

安裝最新ionic即可

Angular2

V2正式版

同上

說明:以上版本號請務必對應,AngularJs每次更新都是斷崖式更新,導致inoic寫法多變。

開發工具:

VS CODE :V1.6.1(老版本對ts支援不是很好)

ionic安裝步驟:

1. 安裝上述版本的Node;

2. 切換源:
npm set registry https://registry.npm.taobao.org # 註冊模組映象
npm set disturl https://npm.taobao.org/dist # node-gyp 編譯依賴的 node 原始碼映象
npm cache clean # 清空快取
如果你的網路訪問米國非常好可以跳過;

3. 安裝ionic,開啟命令列輸入:
npm install -g ionic
npm install -g cordova

4. 然後新建專案,找到一個空地,在這個目錄下執行:
ionic start cutePuppyPics --v2
這是個示例專案,安裝要等很久;

5. 執行該專案,進入到cutePuppyPics目錄,執行:

ionic serve
會啟動一個server,預設會開啟瀏覽器訪問8100埠,谷歌瀏覽器下效果最好。

clip_image002 clip_image004 clip_image006

可以隨意點點,如果Tab都能點,說明環境沒問題。

Ionic目錄說明:

clip_image007

App:系統初始化

Model:自定義的實體類

Pages:系統頁面

Providers:自定義服務

相關文章