Ionic学习笔记——环境搭建

Ionic学习笔记——环境搭建

• Ionic简单介绍

  ionic是用于快速构建Hybrid移动APP的框架，采用了组件化的开发方式。其语法核心是Angular2.0（目前已发布4.0以后的版本了），同时使用Cordova插件获得调用设备本身的能力。目前支持的平台有Android和iOS。

• Ionic环境搭建

  ionic依赖于node.js，使用npm作为包管理工具，因此需要先安装node.js。node.js的版本必须在6以上。

  安装完成后可以使用node -v 和 npm -v 命令测试安装是否完成。

  • npm 全局包路径设置

    npm 安装完成之后默认全局包是在C盘，可以手动修改。

    1. 建立全局包目录

       D:\nodejs\node_global D:\nodejs\node_cache

    2. 配置

       npm config set prefix "D\nodejs\node_global"

       npm config set cache "D\nodejs\node_cache"

    配置完成之后，npm全局包会安装在新的全局包目录下。

  • ionic 安装

    npm install -g ionic

    该命令会将ionic最新版本安装在全局路径，可以使用@3.5.0指定版本。

  • ionic 新建一个项目

    ionic start appname tab

    该命令会在当前目录下新建一个名为 “appname” 的ionic项目，以tab为模板。

    目前官方的模板有 blank、sidemenu、tab、tutorial、super这几个，可以根据需要选择。

  • 在浏览器运行

    ionic serve --verbose

    使用ionic serve 命令就可以在浏览器中运行项目了，加上--verbose的话可以打印debug信息。

    需要注意得是，在浏览器中只能测试组件样式等通用功能，而不能测试设备能力，比如照相机，扫码等，这时候还需要连接上手机或者通过模拟器进行测试。

  ​