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 开发环境搭建

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

ionic项目开发环境配置

参考文章Cordova 3.x 基础(1) – 环境搭建(Windows / Android) http://rensanning.iteye.com/blog/2016364 phoneGap...
  • superjunjin
  • superjunjin
  • 2016年12月02日 22:56
  • 1161

在windows下搭建ionic开发环境

ionic是一个基于HTML5创建类似于手机平台原生应用的开发框架,只有会html,css,js,angularjs就可以开发手机app啦,特别给力,当然要使用它,就要先搭建开发环境啦,网上查了一些教...
  • u010874036
  • u010874036
  • 2016年07月04日 11:20
  • 1377

Ionic开发环境搭建

Ionic是基于web技术开发移动应用的跨平台框架,可开发手机web、Ios、Android应用程序。 1、Ionic环境安装 Ionic开发依赖于Node.js环境,因此需要先安装Node....
  • anda0109
  • anda0109
  • 2018年02月09日 10:52
  • 1026

Ubuntu16.04搭建ionic开发环境

参考ionic中文官网 http://www.ionic.wang/start-index.html先决条件:注:以下命令除有sudo说明外都是在普通用户权限下执行 要有nodejs环境. sudo...
  • u012995856
  • u012995856
  • 2016年06月04日 19:13
  • 1780

ionic框架环境配置

参考文章 Cordova 3.x 基础(1) -- 环境搭建(Windows / Android) http://rensanning.iteye.com/blog/2016364 phoneGa...
  • superjunjin
  • superjunjin
  • 2015年02月02日 19:57
  • 24993

轻松学习Ionic (一) 搭建开发环境,并创建工程(2015-10-26更新)

准备工作
  • zapzqc
  • zapzqc
  • 2014年12月08日 14:09
  • 140994

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

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

Ionic2开发App之环境搭建及demo演示(Win10 64位 )

小半年没写博客了,最近一直在前端的路上摸索,先是之前的Wex5开发,再到现在的Ionic2,由于以前一点没接触过,遇到不少坑,这几天会慢慢整理出来,希望能为你们开发节省点时间。 JDK的安装和搭建就...
  • qq_16497617
  • qq_16497617
  • 2017年05月10日 22:54
  • 579

使用vs2015 配置ionic+cordova 问题

安装首先配置好Java(使用jdk1.8) 环境(配置好用命令行 写上Java看是否安装成功) 跟Android环境(配置好用命令行 写上adb看是否安装成功...
  • s18766991282
  • s18766991282
  • 2016年11月19日 10:18
  • 477
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ionic 开发环境搭建
举报原因:
原因补充:

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