IONIC安装部署入门教程

         这周笨小葱接收到了一个项目任务,用ionic+angularJS写一个hybrid应用程序(也就是native+html混合移动应用)。初次接触andriod还是大三时候的事了吧,当时用google的手势识别类库写了个手势识别应用,之后就是写手游的时候涉及到了移动端开发。对于这两个新技术还是第一次听说。下面就让我们来,一步一步的将一个移动应用demo跑起来。(笨小葱这里是在windows操作系统上进行的)

            

         ionic是一个专注于用WEB开发技术,基于HTML5创建类似于手机平台原生应用的一个开发框架。绑定了AngularJS和Sass。这个框架的目的是从web的角度开发手机应用,基于PhoneGap的编译平台,可以实现编译成各个平台的应用程序。
          ionic的开发添加androidios环境。
          ionic提供很多css组件和javascript UI库。
          ionic可以支持定制android和ios的插件,也支持服务端REST的敏捷开发


安装部署


        1.要安装ionic首先你得需要安装Node.js,简单的说 Node.js 就是运行在服务端的 JavaScript。

             Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。

             Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快性能非常好。

             Node.js官网:https://nodejs.org/en/                       (下载之后双击安装就ok了)


             (PS:安装之后cmd中使用node -v和npm -v来测试是否安装成功)


         2.下面需要通过Node.js中集成的NPM工具来下载cordovaionic

                 Cordova是驱动PhoneGap的核心引擎

             Cordova提供了一组设备相关的API,通过这组API,移动应用能够以JavaScript访问原生的设备功能,如摄像头、麦克风等。
             Cordova还提供了一组统一的JavaScript类库,以及为这些类库所用的设备相关的原生后台代码。
             Cordova支持如下移动操作系统:iOS, Android,ubuntu phone os, Blackberry, Windows Phone, Palm WebOS, Bada...

     cmd中执行命令下载:
 npm install -g cordova ionic
(PS:这里很没有翻墙很可能下载不了或者很慢,这里可以配置淘宝镜像:
<span style="white-space:pre">	</span>npm config set registry https://registry.npm.taobao.org 
	npm info underscore (如果上面配置正确这个命令会有字符串response)

好啦,下载完成后执行:cordova -v 和 ionic -v来查看一下版本,有版本号就说明安装成功了。
 
	下面可以创建ionic应用啦:

创建应用

使用ionic官方提供的现成的应用程序模板,或一个空白的项目创建一个ionic应用:

 ionic start myApp tabs
创建完成后,会在当前目录下生成一个myApp的项目文件。进入myApp文件夹:
 cd myApp
 ionic serve   //这个命令会起一个web容器,将myApp发布到web容器中.会自动打开网站访问地址的
到这里第一个ionic应用就搞定了。这里只有web项目。下面是如何将其打成apk,安装到android手机上。ios笨小葱还没试过。

打包成apk

首先打包apk肯定需要配置java_home和android_home。
1.下载jdk1.7以上的版本。配置对应的JAVA_HOME(这里学过java的都会,不多说了)
2.下载android sdk,不同的ionic版本对于android api的版本要求不一样,现在的最新版本要api22,这里笨小葱分享一个包含api22的。
配置环境变量ADNROID_HOME = E:\android\adt-bundle-windows-x86_64-20140321\sdk
然后在Path中配置: %ADNROID_HOME%\tools;
( 配置完成后,执行java -version 和android -v 不报错说明安装成功。)
这里android开发环境已经配置完成了。就可以使用ionic打包成apk啦.
cd myApp
ionic build android  //编译生成apk,存储在\myApp\platforms\android\build\outputs\apk目录下的android-debug.apk
ionic emulate android //启动android模拟器运行myApp





发布了35 篇原创文章 · 获赞 15 · 访问量 13万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章