ionic 开发环境搭建

原创 2015年11月20日 22:40:37
Ionic是一款基于PhoneGap及AngularJS开发Hybrid/Web APP的前端框架,类似的其他框架有:Intel XDK等。

简单来说就是可以将你的Web应用打包发布成IOS/Android APP,并且提供了PhoneGap之外很多强大的服务和新的特性。

听起来还是很诱人的,事实上这也是目前最火的一中Hybrid APP开发方式。


       接下来介绍如何在Windows下搭建Ionic开发环境:

       一、安装步骤

       1、下载JDK并配置好Java运行环境

        jdk下载地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 

       配置环境:

                     1)、 JAVA_HOME = D:\javar\java\jdk1.6.0_25

                     2)、Path = JAVA_HOME%\bin;%JAVA_HOME%\jre\bin

                     3)、CLASSPATH = .;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar (要加.表示当前路径)

       测试环境变量:cmd 键入命令“java -version”,出现java版本号则说明环境变量配置成功。


      2、下载Apache Ant 并配置环境

      ant下载地址:http://ant.apache.org

      配置环境:

                    1)、ANT_HOME  = D:\apache-ant-1.8.2 

                    2)、Path= %ANT_HOME%/bin;

                    3)、classpath = %ANT_HOME%lib;

      测试环境变量:cmd命令:ant  -version


      3、下载Android sdk并配置环境

      sdk下载地址:http://www.androiddevtools.cn/

      配置环境:

                    1)、ANDROID_HOME  = D:\Program Files\Android\android-sdk

                    2)、path = D:\Program Files\Android\android-sdk\platform-tools;D:\Program Files\Android\android-sdk\tools

      测试环境变量:cmd :abd


      4、下载安装nodejs

      下载地址:https://nodejs.org/download/ 

      下载.msi文件

     

       测试:cmd :node -v


       5、用nodejs 的npm来安装cordova和ionic

        进入cmd窗口,输入npm install -g cordova

        cordova 安装好之后,输入npm install -g ionic

       

        注意:由于 GFW ,很多插件下载不了, 安装时下载速度很慢甚至连接不上, 怎么办呢? 参考:http://anmin.iteye.com/blog/2041022

        文中提到了3种方法,第一种试过很多次均没有成功,推荐第二种;

        代理,在配置中设置代理参数:npm config set proxy=http://127.0.0.1:8087( 配置之前要打开你的 goagent ,记得一定要打开,不然 npm 必然报错。)

         我用的不是goagent,而是lantern,lantern下载地址:http://www.qqtn.com/down/86484.html


       二、创建项目

        android:ionic start myproject  -> cd myproject  ->  ionic platform add android  ->ionic  build android (ios基本同,把所有Android换成ios即可)

        测试:cmd : cd myproject  -> ionic serve

       

        出现以下界面则安装成功

       

        

       

       

      




       




相关文章推荐

Ionic+Cordova开发环境搭建

Ionic+Cordova的组合是一个跨平台的移动开发框架,属于HybirdApp开发模式。其中Ionic是一个前端框架,集成了AngularJs在里面,有很好很漂亮的UI控件。Cordova本身就是...

Ionic 开发环境搭建

Ionic 开发环境搭建1.ionic 是啥ionic 是一个开源的Hibird App 开发框架,通过它就可以直接使用html、css和javascript编写跨平台的移动app了,目前支持 and...

Phonegap、Cordova、Ionic 开发环境搭建(Windows OS)

一、Java运行环境 ----------------------------------------------------------------------------------------...
  • yfy1907
  • yfy1907
  • 2015年12月15日 15:33
  • 340

ionic的开发环境搭建

大致的开发步骤:安装node.js –安装Apache Cordova -安装Java JDK – 安装Apache Ant - 安装android SDK – 安装cordova和ionic – 安...

Windows下Ionic Android开发环境搭建

在Windows下试了试用Ionic开发Android应用,试通了。记录了过程。列在下面,供参考。...
  • foruok
  • foruok
  • 2016年07月23日 20:38
  • 3504

Ionic 开发环境搭建(Windows)

出处 :http://www.jianshu.com/p/b9757a5bcb07 Ionic 概述 Ionic 官网:http://www.ionicframework....

2.ionic系列之ionic开发环境搭建(一)

工欲善其事,必先利其器。本文将介绍在windows平台及mac ox平台搭建ionic开发环境的过程。          1.安装Node.js             打开Node.js官网:htt...

Ionic简单接触:Windows下Ionic Android开发环境搭建

(一)Ionic简单介绍:    首先,Ionic是什么。    ionic地址: http://ionicframework.com 签名,打包http://www.cnblogs.com/q...

Ionic从零单排(一)——Ionic开发环境搭建

Ionic是一个用来开发混合手机应用的开源框架,其基于Angular语法,学习Ionic之前,应该了解HTML、CSS、 JavaScript、Angular的基本语法。         Ionic...
  • dkbnull
  • dkbnull
  • 2017年01月29日 21:37
  • 738

ionic开发介绍之环境搭建

开发环境搭建 安装Node.Js。用于安装各种开发工具做准备; 安装ionic构架和cordova库,这里分开安装ionic和cordova是因为墙的不稳定的影响,通常不能一步就安装成功。因此...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ionic 开发环境搭建
举报原因:
原因补充:

(最多只允许输入30个字)