A-A+

ionic3开发hybrid app 教程之环境搭建

2017年06月03日 APP开发 暂无评论 阅读 41 views 次

1.安装Node.js

Node.js建议安装最新版本,下载地址:

https://nodejs.org/en/

经测试,5.x版本在编译的时候有可能会报错,请安装最新的6.x版本。

安装完后请打开Node命令行(Node.js command prompt),输入以下命令看一下版本号:

Microsoft Windows [版本 10.0.14393]
(c) 2016 Microsoft Corporation。保留所有权利。

C:Usersacer>node -v
v6.10.2

C:Usersacer>npm -v
5.0.1

请保证安装的 Node 和 npm 为较新的版本。根据近期学习 Ionic 的经验,Ionic 2是个非常喜欢追求最新版本的项目组,以前用的好好的代码,说不定某个版本就无法编译通过。某次更新后,JDK也需要升级到最新版本才行。所以强烈建议所有的工具都保持最新。

还有一点需要注意的,因为国内的网络环境原因,在下载npm包的时候经常会遇到无法正常下载的情况。国内淘宝推出了 npm 镜像,这是一个完整的 npmjs.org 镜像,同步频率为15分钟一次,保证与官方服务同步。推荐使用该镜像。使用方法如下:

输入以下命令,切换到淘宝镜像源:

npm install -g cnpm --registry=http://registry.npm.taobao.org

本GitBook之后所有用到的 npm 命令都可以使用 cnpm 来代替进行 install。但是 cnpm 不支持 publish 命令,需要注意。

+

关于淘宝 npm 镜像的其他使用问题,请参考:

https://npm.taobao.org/

2.安装Ionic2

输入以下命令安装 Ionic (如果刚才设置了淘宝镜像源,可以使用 cnpm 代替 npm):

npm install -g ionic

需要注意的是,如果之前安装过 Ionic 2 的 beta 版本,需要先卸载掉:

npm uninstall -g ionic

然后重新安装。

安装完成后输入以下命令看一下版本号:

C:Usersacer>ionic -v
3.3.0

目前最新版本是3.3.0。如果是 beta 版本的话,请重新安装,确保安装最新版。

3.装Cordova

输入以下命令安装 Cordova:

npm install -g cordova

看一下版本号:

C:Usersacer>cordova -v
7.0.1

4.安装JDK

为了编译到 Android平台,还需要安装JDK。因为我木有 iOS 设备,就不研究 iOS 的打包了。

注意请安装最新版本的 JDK,下载地址:

http://www.oracle.com/technetwork/java/javase/downloads/index.html

下载8u111或8u112以上版本。安装时建议安装到C:Java 目录下。然后设置系统变量:

名称:JAVA_HOME,值(根据你的安装路径改): C:Javajdk1.8.0_101

在Path中添加 %JAVA_HOME%bin

千万不要从百度搜索安装,会带垃圾的。

安装完后输入以下命令看一下版本:

C:Usersacer>javac -version
javac 1.8.0_131

C:Usersacer>java -version
java version "1.8.0_131"
Java(TM) SE Runtime Environment (build 1.8.0_131-b11)
Java HotSpot(TM) 64-Bit Server VM (build 25.131-b11, mixed mode)

这就表示安装成功了。

5.安装android SDK

下载并安装AndroidSDK

前面两步,我们已经配置了JDK变量环境,并安装好了Eclipse,通过这两步之后Java的开发环境就准备好了,如果我们只是开发普通的JAVA应用程序的话,那么到这里就可以了。但如果我们要通过Eclipse来开发Android应用程序的话,那么我们还需要下载Android SDK(Software Development Kit)和在Eclipse上安装ADT插件。

首先,下载Android SDK Tools,翻过墙的朋友可以去Google Android的官网上下载(http://developer.android.com/sdk/index.html)。不愿意翻墙的朋友,可以去我的bd网盘上下载(http://pan.baidu.com/s/1nt8BcBB),或者去这个网站下载(http://www.androiddevtools.cn/)。下面介绍一下在这个网站上下载的情况,首先打开http://www.androiddevtools.cn/,我们可以看到这里面有Android开发所需的各种工具,首先找到SDK Tools:

选择一个最新的版本就行了。注意,这里有exe和zip两种文件可供下载,exe的就是个安装程序,下载下来需要自己双击安装。这里建议下载zip压缩包,下载后,直接解压缩到你想要安装Android的路径就行了。解压后的文件目录如下:

然后就双击“SDK Manager.exe”,启动SDK Manager,如图所示:

看到有这么多需要选择安装的时候,是不是一时有点头脑发昏眼冒金星不知道咋办了啊。。。尤其是对于像Neo这种重度选择恐惧症患者来说,真是感觉脑袋都要爆浆了。。。这个时候啦,一定要keep calm。

在这里我只说几个必须要安装的,如上图所示的,Tools文件夹里面的Android SDK Tools(这个我们在之前的一步已经下载好了的,一般不会让你再安装了,不过有可能会让你更新),然后就是Android SDK Platform-tools和Android SDKBuild-tools,注意只需要下载最新的版本就行了。

然后就是API的选择了。我们可以看到这里提供了很多很多从Android 2.2到Android 5.x的很多版本的API,那么怎么选择呢。这里我建议,新手的话,选择一个最新的版本就好了,因为Android是向下兼容的。其他的以后你要用到了在下载就行了(因为下载安装的速度实在太慢啦。。。)。所以如上图所示,这里我只选择了下载当前最新的Android 5.1.1(API 22)。这里需要说明的是,如果你以后不打算用模拟器调试,而是一直用真机来调试的话,那么就可以不用装“system images“了。不过新手的话,不知道怎么选择,还是建议直接全部勾上吧,

最后就是extras文件夹中的东西了,如下图所示,

理论上来说,extras中的东西如果网速允许,时间充沛的话,就都下载了吧,应为都是好东西。不过一开始安装的话,可以只用安装上图中的三个,即Android Support Repository、Android SupportLibrary和Google USB Driver。其他的以后有时间再慢慢下载吧。

接下来就可以进行安装了。要注意,由于这些东西都是在google 的服务器上下载的。由于俺们天朝有墙,所以可能会出现连接不上的情况,如下图:

这种时候,我们可以通过有Android SDK的国内镜像服务器来下载安装,这里推荐几个:

1、中科院开源协会镜像站地址:

IPV4/IPV6 : http://mirrors.opencas.ac.cn 端口:80

2、北京化工大学镜像服务器地址:

IPv4: http://ubuntu.buct.edu.cn/  端口:80

IPv4: http://ubuntu.buct.cn/  端口:80

IPv6: http://ubuntu.buct6.edu.cn/  端口:80

3、大连东软信息学院镜像服务器地址:

http://mirrors.neusoft.edu.cn  端口:80

 

随便选择一个就行啦。这里我选择的是第三个站点,即大连东软的镜像,使用方法如下:

首先,点击菜单中的“Tools”,然后选择下拉中的“Options…”,

2017-06-03_084334

然后在弹出的对话框中,填写HTTP Proxy Server为mirrors.neusoft.edu.cn(镜像服务器的地址,注意前面不要加http),然后填写HTTP Proxy Port为80 (端口号)。最后在勾选下面的Forcehttps://... sources to be fetched using http://...复选框,

接着点击close,关闭对话框,再重新启动SDK Manager就行啦。

经过漫长的下载安装过程后(建议在晚上睡觉的时候下载。。。),我们可以看到,之前选中安装的项目后面的状态都由之前的“Not installed”变为了如今的“Installed”,这就表示我们已经安装成功了!有没有很兴奋啊。。

由于直接使用SDK Manager在线下载安装的方式,非常漫长,如果不想等待那么长的朋友,可以自己到国内的站点(http://www.androiddevtools.cn/)上去下载需要安装的package,这种方式要快得多,不过就是要注意选择好自己需要下载的package以及相应的版本,在此就不加详述了,有选择恐惧症的硼油可以给我留言。

 

Ok,接着就是最后一步,我们熟悉的设置环境变量。这里需要把”platform-tools“和”tools”路径追加到系统环境变量Path中,具体如下:

首先,新建一个系统环境变量,变量名为ANDROID_SDK_HOME,变量值为你的SDK安装路径,这里我的安装路径为D:androidandroid-sdk,

然后就是在系统的Path变量后,追加;% ANDROID_SDK_HOME%platform-tools;% ANDROID_SDK_HOME%tools

然后我们可以检验一下Android SDK是否安装成功:在命令行窗口中输入”adb version“,出现如下显示,则安装成功了:

 

C:\Users\acer>adb version
Android Debug Bridge version 1.0.39
Revision 3db08f2c6889-android
Installed as D:\Android\sdk\platform-tools\adb.exe 

打赏作者
如果文章对您有所帮助请打赏支持本站发展。

您的支持将鼓励我们继续创作!

[微信] 扫描二维码打赏

[支付宝] 扫描二维码打赏

标签:

给我留言

您必须 登录 才能发表留言!

Copyright © 大一网 保留所有权利.   Theme  Ality

用户登录 ⁄ 注册

分享到: