ionic介绍

Ionic是一个开源UI工具包,用于使用Web技术(HTML,CSS和JavaScript)构建高性能的高质量移动和桌面应用程序。
Ionic专注于前端用户体验,或应用程序的UI交互(控件,交互,手势,动画)。它易于学习,并与其他库或框架(如Angular)很好地集成,或者可以独立使用而无需使用简单脚本包含的前端框架。
目前,Ionic已与Angular正式集成,且对Vue和React的支持也正在开发中。

Node.js、Npm环境搭建

下载Node.js

打开Node.js官网,选择下载LTS版本,MAC下载PKG文件,WINDOWS下载MSI文件,下载完成后找到文件,一路傻瓜式确定到底安装。

测试Node.js安装是否成功

打开终端,执行如下命令:

node -v

出现如下图界面即安装成功。
Node安装成功

安装nrm

众所周知,由于国内特殊原因,NPM连接官方源下载依赖非常慢,所以需要切换至如淘宝源之类的国内源以提升下载速度。

nrm介绍及安装

nrm是专门用来管理和快速切换源的工具
终端/命令行执行如下命令:

npm i -g nrm 

nrm环境安装

查看当前源

nrm current

切换淘宝源

nrm ls
nrm use taobao

切换淘宝源

安装ionic、cordova

安装

npm install -g ionic cordova

ionic安装

验证是否安装成功

使用如下命令验证是否安装成功:

ionic --version
cordova -v

验证ionic安装

安装Gradle(可选,打包安卓APK需要)

Gradle需要JDK1.8环境

使用包管理器安装(仅MAC用户可选)

SDKMAN安装

sdk install gradle 5.4.1

5.4.1为Gradle版本号,可修改为当前gradle最新版本号

BREW安装

brew install gradle

使用源码安装

下载最新版本Gradle

目前的Gradle版本是版本5.4.1,于2019年4月26日发布。

打开安装包

MAC用户

将文件解压缩到您选择的目录中,例如:

mkdir /opt/gradle
unzip -d /opt/gradle gradle-5.4.1-bin.zip
ls /opt/gradle/gradle-5.4.1
WINDOWS用户

使用文件资源管理器创建新目录:C:\Gradle。
打开第二个文件资源管理器窗口,然后转到下载Gradle分发版的目录。双击ZIP存档以显示内容。将内容文件夹gradle-5.4.1拖到新创建的C:\Gradle文件夹中。

配置系统环境

MAC用户

配置PATH环境变量以包含解压缩目录下的bin目录,例如:

export PATH=$PATH:/opt/gradle/gradle-5.4.1/bin
WIDNOWS用户

在文件资源管理器中,右键单击This PC(或Computer)图标,然后单击Properties- > Advanced System Settings- > Environmental Variables。
在选择下Path,然后单击Edit。添加条目C:\Gradle\gradle-5.4.1\bin。单击“确定”保存。

安装Android SDK(可选,打包安卓APK需要)

在此暂时忽略此部分,详情请查看后续ionic打包发布教程。

安装Xcode(可选,打包苹果app需要)

在此暂时忽略此部分,详情请查看后续ionic打包发布教程。