【Ionic2序列】二、安装环境

时间：2017-02-24 23:57:45
作者：zhongxia

不管学习什么，环境都是要先安装起来，然后边学习边敲代码，这样才能学习掌握的深。

零、总结

本节没有什么难点，照着来就行了。 安装环境可能 Android SDK 安装会 因为网络环境出问题， 具体笔者没有尝试过，就不多啰嗦了，自行百度。或者等后面笔者尝试过后，写教程。

1. 安装 nodejs
2. 用 nvm 管理 node版本， 用nrm 管理 npm 镜像源
3. 用 npm 安装 ionic2 ， cordova
4. IOS环境，则看下Xcode是否为最新版本
5. Android环境，安装JDK，Android SDK
6. 生成脚手架，跑简单DEMO。

本教程以Mac系统 + IOS 为主，Window系统，自行百度哈

一、安装Node

# 1. 安装Node
brew install node

# 2. 检查是否安装完成
node --version
npm --version

# 3. 用这个来管理Node的版本
npm install -g nvm 

# 4. nvm简单使用方法
nvm ls   # 查看已安装的Node版本

╰─➤  nvm ls 
         v4.4.4
         v5.9.0
->       v6.3.0
         v7.1.0
         system
default -> 6.3.0 (-> v6.3.0)
node -> stable (-> v7.1.0) (default)
stable -> 7.1 (-> v7.1.0) (default)
iojs -> N/A (default)


nvm use v6.3.0 # 使用指定版本

nvm --help # 帮助，然后看使用

Example:
  nvm install v0.10.32                  Install a specific version number
  nvm use 0.10                          Use the latest available 0.10.x release
  nvm run 0.10.32 app.js                Run app.js using node v0.10.32
  nvm exec 0.10.32 node app.js          Run `node app.js` with the PATH pointing to node v0.10.32
  nvm alias default 0.10.32             Set default node version on a shell


# 5. 安装nrm来管理npm的镜像源
npm install -g nrm 

─➤  nrm ls                                                  
  npm ---- https://registry.npmjs.org/
  cnpm --- http://r.cnpmjs.org/
* taobao - http://registry.npm.taobao.org/
  edunpm - http://registry.enpmjs.org/
  eu ----- http://registry.npmjs.eu/
  au ----- http://registry.npmjs.org.au/
  sl ----- http://npm.strongloop.com/
  nj ----- https://registry.nodejitsu.com/
  pt ----- http://registry.npmjs.pt/

nrm test taobao # 测试淘宝镜像源的速度

npm use taobao # 使用淘宝镜像源

二、安装 Ionic2, cordova

常规npm安装，没有啥特别的。

npm install -g ionic2 cordova

ionic2 -version

三、IOS 环境

貌似不需要安装什么了，就如果自己的Xcode还是旧的，就给升级下。 还有要注意一个事。 Xcode 程序要放在 Application 根目录下， 不要乱移动。【我有过这个错误】

四、Android环境

4.1 JDK

安装个最新的，1.8x， 官网下载安装包，然后一直下一步。 然后设置一个 path（环境变量）。

JAVA_HOME 环境变量

自行查找教程，这里不写了。【这个简单，大家随意】

4.2 Android SDK

下载一个Android Stuidio ，然后安装， 在设置 ANDROID_HOME 的环境变量。

自行查找教程，这里不写了。【这个因为没有具体安装过，写了也是忽悠人】

五、环境安装好了，来测试下吧

# 初始化项目脚手架
ionic start MyIonic2Project tutorial --v2

# MyIonic2Project 自定义的项目名

# tutorial  脚手架项目名（不写，默认 tab）

# --v2 代表创建 Ionic2的脚手架【必须要加，如果用Ionic2】


# 初始化好之后，运行跑起来吧, 会自动打开浏览器
ionic serve 

# 运行端口是 8100 ，如果被占用则

# 看8100端口被谁占用【window下应该没有该命令，因此自行找办法】
lsof -i tcp:8100

# 杀掉杀掉进程
kill [pid] 

好啦，本节结束了。 下面开始学习目录结构以及怎么写代码吧。