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

项目启动成功以后会自动在浏览器中打开