ionic开发环境的搭建及快速使用

 

您可自由转发此文， 但请保留出处：Ionic在线学习网站  http://www.ioniconline.com

Abstract

本文档介绍ionic开发环境的搭建步骤

---

1. UBUNTU环境的搭建

• 下载ubuntu-12.04.5-desktop-amd64版本，下载地址：http://releases.ubuntu.com/12.04/

• 下载vmware10.0.0 ,下载地址：http://www.xpgod.com/soft/8592.html

• vmware安装ubuntu：http://jingyan.baidu.com/article/14bd256e0ca52ebb6d26129c.html

2. ANDROID系统编译环境

• Java/JDK包，这个可以自行到官网下载。这个注意要将java安装路径的bin目录加入系统或用户的环境变量path中，安装完可以在命令行窗口输入java -version，看是否有反应。
• 下载ADT（Android Development Tools）这个到官网下载：（http://developer.android.com/sdk/index.html ）。 下载后解压ADT，这个里面主要包含两个文件夹，一个是装好插件的eclipse，用于开发Android应用，另外一个是android开发sdk目录。需要将sdk/platform-tools这个路径加入系统环境变量path中，为了以后调试用到adb
• 下载安装ant这个是在用phonegap的cordova工具生成android项目时，需要的编辑工具。下载地址：（http://ant.apache.org/bindownload.cgi ），安装完之后要注意，一定要在命令行窗口输入 ant 命令，看是否报错。我的这个就报错：在jre目录找不到tools.jar。解决方法很简单，自己看了一下jre目录是没有，在jdk目录下lib目录有tools.jar，于是拷贝一个过去就解决了

上面的步骤基本上将Android应用所需要的软件包安装完毕。

3. 安装NODEJS

接下来安装node.js,目前可以使用三种方法，使用当中任一种即可。

方法1：

• curl –silent –location https://deb.nodesource.com/setup_4.x | sudo bash –
• sudo apt-get install nodejs

方法2：

• 访问https://nodejs.org/en/下载nodejs的软件包并安装

方法3：

• wget http://nodejs.org/dist/v4.2.1/node-v4.2.1.tar.gz
• tar zxvf node-v4.2.1.tar.gz
• cd node-v4.2.1
• ./configure && make &&make install

4. 利用NODEJS中提供的NPM来安装IONIC和CORDOVA

最后安装cordova和ionic:

• sudo npm install -g cordova
• sudo npm install -g ionic

注意：cordova一般都可以正常安装成功，由于国家的长城过于坚固，安装ionic会提示各种提取错误，解压失败。失败后使用npm config ls -l命令查看npm缓存文件在哪儿，一般在用户文件夹下的.npm。找到ionic文件夹下1.7.8[版本号]下的package.tgz用7zip打开，找到里面的npm-shrinkwrap.json导出用编辑器把里面的包地址全部替换为http://registry.npm.taobao.org，保存后再替换到包里。然后删除缓存文件夹下除ionic文件夹的其它文件，再次安装ionic，便可以成功安装了。

5. 快速开发一个IONIC应用

使用下面命令来创建和编译应用：

• $ ionic start myapp tabs
• $ cd myapp
• $ ionic platform add android(ios)
• $ ionic build(ios)

android编译成功后目录下会生成apk，可以导出安装

编译后运行命令：

• 在android(ios)虚拟机上调试：$ ionic emulate android(ios)
• 在android(ios)真机上调试：$ ionic run android(ios)

您可自由转发此文， 但请保留出处：Ionic在线学习网站  http://www.ioniconline.com