window系统 ionic环境搭建,创建打包 android app

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/shi851051279/article/details/52644981

之所以写下这篇博客都是因为我堂堂天朝上国的墙砌的太高太后了!让我再ionic环境搭建的路上充满坎坷!而且网上这方面系统的文档也是少的可怜!所以决定写下这篇博客一来是为自己以后再用的时候可以打开看看,二来可以给想学习ionic但是对环境搭建一头雾水的初学者提供一点点参考!
下边是环境搭建步骤:
一 .先下载 java jdk软件
之前写过一个 win7 系统 java jdk 环境变量配置文档 win7系统的可以看下:http://blog.csdn.net/shi851051279/article/details/52584570

下载地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
根据自己电脑的系统类型选择相应下载 x86是32位操作系统,x64是64位操作系统;x86是32位操作系统;

这里写图片描述

下载好以后点击安装,安装过程和安装目录最好都是默认,就这样下一步下一步直到安装完成!那么对应的安装目录应该是C:\Program Files\Java下,
接下来就是配置环境变量的过程了
1.右击我的电脑选择 –>> 属性 –>>高级系统设置 –>>高级 –>>环境变量
如图:

这里写图片描述

2.在系统变量中新建
变量名: JAVA_HOME
变量值: C:\Program Files\Java\jdk1.8.0_102 (这里和下边的环境变量值都是我们自己电脑上的jdk安装目录)

这里写图片描述

3.在系统变量中查找 Path 编辑 ,再原有的系统变量中添加如下变量值
变量名: Path
变量值: C:\Program Files\Java\jdk1.8.0_102\bin;C:\Program Files\Java\jre1.8.0_102\bin

这里写图片描述

4.在系统变量中新建
变量名: CLASSPATH
变量值: .;%JAVA_HOME%lib;%JAVA_HOME%lib\tools.jar (注意:前边的点一定不要丢掉)

这里写图片描述

到这里 java jdk 就算配置完成了,win10找到命令窗口(win7通过找到 开始 –>>运行窗口 输入cmd 回车 打开命令窗口! )
在命令窗口中输入 java 回车
如图:显示出一大串文字 !

这里写图片描述

然后再输入javac 回车
如图:又一大串文字!
这里写图片描述

到这里就说明 java jdk 环境变量配置成功了!

二。第二部按理说应该是去下载android sdk 了,但是因为sdk 下载比较困难而且配置起来步骤也比较多;所以这里我用的android adt 集成包,这里边的android sdk都是更新好的初学者可以不用更新;下载页面: http://bbs.phonegap100.com/thread-1456-1-1.html 这个页面里边有百度云盘adt下载;下载完成以后找到adt 文件夹 复制;随便找一个盘在根目录下新建一个文件夹(文件夹一定要用英文命名,不然后边配置环境变量的时候会出错!)然后粘贴把复制的adt文件 粘贴到这个新建的文件夹中;我这里是放在G盘的的根目录下的phoengap文件夹;
如图:
这里写图片描述

这时候开始配置adt的环境变量,和刚才配置java jdk变量差不多,右击我的电脑选择 –>> 属性 –>>高级系统设置 –>>高级 –>>环境变量
1.在系统变量中新建
变量名: ANT_HOME
变量值: G:\Program Files\adt\eclipse\plugins\org.apache.ant_1.8.3.v201301120609

这里写图片描述

2.在系统变量中查找 Path 编辑 ,再原有的系统变量中添加如下变量值
变量名: Path
变量值: G:\Program Files\adt\sdk\tools;G:\Program Files\adt\sdk\platform-tools;%ANT_HOME%\bin(注意:如果是win7的话 每个目录一定要用小写英文分号隔开!)

这里写图片描述

现在配置完成;和刚才一样找到命令窗口:
输入 ant 回车
如图:出现BuildFile: build.xml does not exist! build failed  说明ant安装配置成功 !

这里写图片描述

三。去nodejs官网下载nodejs最新版本 地址:https://nodejs.org/en/ (这里官网会根据当前访问网页电脑的操作系统自动提供版本!选择最新版下载即可!)

1.下载好以后点击安装,安装在哪个盘都可以 安装的时候选择 add to path 安装 ,nodejs系统变量会自动配置好!

这里写图片描述

2.安装完成以后,打开命令窗口
输入 node -v 会提示nodejs 版本 说明nodejs安装成功;
3.安装 cordova ionic
输入 npm install -g cordova ionic 回车
如图:

这里写图片描述

这里安装比较慢需要多等一会,这里的警告不用管,只要不报错就等他继续安装;如果实在太慢的话可以找个vpn试试!
安装完成以后可以分别
输入 cordova -v
输入 ionic -v
来查看版本信息
如图:

这里写图片描述

4.现在就可以创建项目了
首先我们先切换到自己想要把项目创建在的 那个盘
这里我把项目也创建在了G:盘 !
然后输入 ionic start myApp tabs 回车 (这里myApp 就是项目名称)
如图:

这里写图片描述

这里创建的也非常慢 还是那句话只要不报错自动停止就继续等吧;谁让我大天朝的墙折磨厚呢!如果报错停止的话 (前提前边的环境搭建都没问题)就在重新创建几次试试。我这里也重新创建了好几次!如果想要自己停掉重新创建的话可以Ctrl + C 停止 ,然后重新创建!

5.创建完成后通过命令打开我们的myApp文件
输入 cd myApp 回车

然后在这里我先把项目用谷歌浏览器打开调试开发的 最后在添加 创建 的android平台 ;如果你想直接添加 创建 android平台 可以参考文档:http://www.runoob.com/ionic/ionic-install.html 或者是跳过这一步骤到 下边的第6步
输入 ionic serve 回车
下边会出现提示选择 通过 本地 ip 访问 还是 localhost访问 输入提示信息编号 1 或者是2 回车,这时候谷歌浏览器会自动打开网页

现在我们就可以用自己喜欢的编辑器导入myApp项目编辑开发了!

6.接下来添加android平台了通过命令窗口 切换到放置myApp的盘
输入cd myApp 然后
输入 ionic platform add android 回车 这个命令的意思就是添加 android平台
如图:

这里写图片描述

7.建立android平台
输入 ionic build android 回车 这个命令的意思就是建立 android平台
相信大家到了现在已经很不耐烦了把,不过其实现在build 完成以后 就可以找到 我们打包好的 apk 应用程序, 安装到手机上了;这里的build完成以后 系统会在命令窗口中出现 apk 现在所在目录的提示信息;我们可以通过这个路径找到 apk 发送到手机 上安装;先提前体验下成功的快感把哈哈!!
如图:

这里写图片描述
这里写图片描述

但是通过这个办法调试的的话就会非常笨拙了;现在我们来说一个简单的方法

8.打开我们的命令窗口 切换到myApp项目所在的盘
输入 cd myApp 回车 打开项目 然后
输入 adb devices 回车
查看有没有可以链接的设备手机(我用的小米手机通过数据线链接的 启用开发者环境;这里我们可以根据自己的手机品牌百度下怎么链接 )
如果有设备可以链接的话 会出现提示信息
如图:

这里写图片描述

9.然后我们输入 ionic run android 回车 apk 稍等一下就会自动安装到我们的手机上,然后就可以在手机上看到自己创建的 myApp 效果了;

最后说一下写的不对的地方或者有更好的办法的大神一定要给我留言交流哈!
下边链接的这个文章是 打包时的具体方法
个人认为写的不错就把链接沾到这里了:http://www.111cn.net/sj/iOS/103775.htm

阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页