ionic 环境搭建，运行项目到浏览器，android手机，模拟器

1.node.js安装 ，去官网下载mostusers版本，不需要最新版，最新版不太稳定，安装之后会在环境变量里面自动添加，可在命令行输入：node --version 查看是否安装成功

 

2，进入命令行窗口，输入npm install npm -g  此命令安装npm  npm是后续ionic打包相关所需的

在命令行输入npm-v 可查看是否安装成功，如果返回版本号则安装成功

3命令行输入npm config set registry http://registry.npm.taobao.org/ 

(这是国内镜像淘宝源地址)

切换npm源的访问地址的切换(因为国内对于外网的诸多限制,很有可能在你下载npm下包的内容造成访问被墙,或是下载速度过慢的情况,而切换这个访问的网址到国内的镜像源,就可以很好的避免了访问受限和下载时间过长的问题)

更改源路径后,要想查证自己所切换的源路径是什么以及是否成功,可以使用命令:  npm config get registry 进行查验

4.命令行通过命令:npm install -g cordova

安装cordova

cordova-v (安装完成后的查看版本的命令)

5，命令行通过npm安装ionic

 命令为：npm install -g cordova ionic

此过程会下载ionic相关东西，如果网络慢，可能需要时间久

ionic -v (安装完成后的查看版本的命令)

6,在自己想创建项目的位置创建项目目录 我的是D:\android\code\ionicpro  

命令行进入通过 cd D:\android\code\ionicpro 进入此目录

输入:

ionic start myapp tabs//创建一个带top栏和bottom栏的示例项目

ionic start myapp sidemenu//创建带有左侧有menu栏的示例项目

ionic start myapp blank //创建一个 空白项目

上面三个任选一个,创建项目

7,命令行输入:cd myapp 进入项目目录  

输入:cnpm -i 

下载项目相关依赖

8,命令行输入ionic serve 运行项目到浏览器,则会出现下面界面

9,下载android studio ,jdk 最好是1.8以上的 

配置jdk环境:新建系统变量JAVA_HOME,值为jdk安装目录,类似D:\installsoft\jdk,在系统变量找到path变量名,点击编辑:

新增:%JAVA_HOME%\bin  和%JAVA_HOME%\jre\bin

配置android环境:新建系统变量ANDROID_HOME,值为androidsdk的存储目录:类似:C:\Users\GS\AppData\Local\Android\sdk

在系统变量找到path变量名,点击编辑:

新增:%ANDROID_HOME%\tools和%ANDROID_HOME%\platform-tools

新建系统变量ANDROID_SDK_ROOT  值为sdk安装目录,类似C:\Users\GS\AppData\Local\Android\sdk  此和ANDROID_HOME 一样,配置这个是因为在后面构建andorid的时候会提示配置这个变量,不配置不成功,有可能你的项目不会报这个错

配置gradle环境:新建系统变量:GRADLE_HOME  值为gradle目录,类似C:/Users/GS/.gradle/wrapper/dists/gradle-4.10.1-all

path里面新增:%ANDROID_HOME%\455itskqi2qtf0v2sja68alqd\gradle-4.10.1\bin

10,命令行输入

android平台:

ionic cordova platform add android：添加android平台

ionic cordova run android  运行到android真机或者模拟器
ionic cordova build android：编译安卓项目

ios平台:

ionic cordova platform add ios：添加ios平台

ionic cordova build ios：编译ios项目

 ionic cordova run ios

11,在build android 的时候可能会遇到说缺少scss文件,这是由于缺少sass,使用命令:cnpm install node-sass --save

12,运行到真机或者模拟器会出现空白情况:

命令行输入:ionic cordov/ plugin /dd cordov/-plugin-spl/shscreen

ionic cordov/ plugin /dd cordov/-plugin-st/tusb/r