Ionic 環境搭建和安裝教程

Ionic 環境搭建和安裝教程

本篇教程基於 Ionic 官方文檔編寫，但願對初次安裝 Ionic 的大家有所幫助。

環境搭建

在使用 Ionic 框架以前，惟一的前提條件是 Node 和 npm 環境。

固然，你一樣須要一個代碼編輯器。這裏推薦使用 VS Code。

Node & npm

安裝 Node.js 和 npm

• 下載（推薦下載 LTS 版本）：Node.js
• 安裝：雙擊下載的文件直接安裝便可（npm 是和 Node 捆綁安裝的，無需單獨安裝）

• 驗證是否安裝成功：

  • 打開新的cmd窗口，輸入：

    $ node --version
    $ npm --version

  • 出現版本號說明安裝成功

安裝 Ionic CLI

• 直接在 cmd 中輸入下方命令安裝：

  $ npm install -g ionic

• 驗證是否安裝成功：

  $ ionic -v

  出現版本號等信息說明安裝成功。

安裝 Cordova

• 直接在 cmd 中輸入下方命令安裝：

  $ npm install -g cordova

• 驗證是否安裝成功：

  $ cordova -v

  出現版本號信息說明安裝成功。

建立項目

這裏有三種最多見的啓動器可供選擇，分別是blank啓動器，tabs啓動器和sidemenu啓動器。須要在指定路徑中建立項目的話，使用cd進入指定路徑便可，默認爲當前路徑。

• 直接在cmd中輸入下方命令安裝：

  $ ionic start myApp tabs

• 耐心等待建立完成，進入對應的文件夾便可看到建立的項目。

運行項目

• 在cmd中cd進入到剛纔建立的項目文件夾（myApp）

  $ cd myApp

• 使用ionic serve命令來啓動項目

  $ ionic serve

項目啓動成功以後會自動在瀏覽器中打開