ionic+cordova项目打包

主要流程:
安装node.js –> 安装jdk –> 安装AndroidSDK –> 安装cordova –> 安装ionic –> 创建项目 –> 编译项目apk

一、安装nodejs
百度网盘:链接:https://pan.baidu.com/s/1Xxfh2kv_2Wn9nbF5AX9NZQ 提取码:turm 或 下载地址:https://nodejs.org/en/

查看nodejs版本:  node -v

查看npm版本:  npm -v

安装淘宝镜像 :  npm install -g cnpm –registry=https://registry.npm.taobao.org

查看cnpm版本:  cnpm -v

二、安装jdk
百度网盘中已包含。或 下载地址:http://www.oracle.com/technetwork/java/javase/downloads/index.html

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

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

在Path中添加 %JAVA_HOME%\bin

查看版本:  java -version

三、安装sdk
右键X解压

重命名为sdk

跟jdk放在一个父目录,便于查找。C:\Program Files\sdk

配置环境变量
计算机——右键属性——-高级系统设置——-环境变量

网盘中已包含。

在系统变量中新建:

变量名:ANDROID_HOME

变量值:C:\Program Files\sdk

在Path变量中将

;%ANDROID_HOME%\platform-tools;%ANDROID_HOME%\tools

添加到变量值最后(注意前面有分号)

检查配置是否正确:

 android -h

执行命令就代表安装无误。
在这里插入图片描述

SDK Manager.exe工具
打开界面上的Tools,选择options,先配置国内镜像:

域名千万不要输入http或者https协议前缀

mirrors.neusoft.edu.cn

回到主界面,点packages再点reload

按照下面图片进行勾选:

点右下角 install packages 来安装,耐心等待即可。

在打包时可能会出现如下错误:

打开SDK Manager.exe继续安装你所需要的平台。圈起来的27与报错图片中的27对应,如果出现其他的错误,下载对应的平台就可以了。

四、安装cordova
输入以下命令安装 Cordova:

npm install -g cordova
看一下版本号:

C:\Users\yxd>cordova -version
6.3.1
五、安装ionic
输入以下命令安装 Ionic (如果刚才设置了淘宝镜像源,可以使用 cnpm 代替 npm):

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

npm uninstall -g ionic
然后重新安装。

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

C:\Users\yxd>ionic -version
2.1.0
目前最新版本是2.1.0。如果是 beta 版本的话,请重新安装,确保安装最新版。

六、创建ionic项目
搜索node,点开红框内的node.js command prompt ,不是下面的那个node.js

cd到要放置app的目录下,执行:

ionic start myapp tabs

解释:

myapp:项目名称(自定义)

tabs:ionic模板,还有blank

还有其他模板可以自己选择,执行 ionic start myapp 下载需要时间,请耐心等待。

创建完成之后,cd到app目录运行项目
执行:  ionic serve 启动

浏览器地址栏:localhost:8100预览项目

七、添加平台
cd 到app目录下,执行  ionic cordova platform add android

添加完平台后app目录下会多了一个 platforms 文件夹

八、下载gradle插件

打开:http://services.gradle.org/distributions/ 选择 gradle-2.14.1-all.zip 或者 百度网盘中包含该插件,可直接下载;

下载完不用解压,直接拷贝到项目文件下的这个文件下:

注意:新项目没有gradle这个文件夹,需要新建一个,文件名不要写错。

将下载压缩包加压到其他文件夹内,需要配置环境变量 path: D:\Program Files\gradle\gradle-2.14.1\bin,根据你文件位置配置,如果不会不会百度。

修改配置:
找到下面路径下的 GradleBuilder.js文件

用代码编辑器打开 GradleBuilder.js:

将:   ‘https\😕/services.gradle.org/distributions/gradle-2.14.1-all.zip’ 改为:  ‘…/gradle/gradle-2.14.1-all.zip’

保存关闭。

九、打包
cd到app目录下,执行:  ionic cordova build android

打的apk包在画红线那个路径下面。将apk文件发送到手机就可以安装了

参考:https://yanxiaodi.gitbooks.io/ionic2-guide/content/tutorial;该地址有时刷新不出来,需要要多少试几次。

https://www.cnblogs.com/chenglu/p/8608121.html

文章为转载,如有需要可删除,转载地址:https://www.cnblogs.com/mustanglqt/p/10155258.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值