webapp运行环境配置

时间:2022-11-16 17:14:32

一、原生应用的编译、打包工具:

1.1 比如IOS,必须在apple机器上才行。使用开发ios的那一套编译器

1.2 android,在机器上安装Android的一套编译器:比如AndroidSDK,下载地址是https://dl.google.com/android/installer_r24.4.1-windows.exe

二、安装AndroidSDK

用管理员安装,安装完android SDK后,生成SDK Manage负责下载或更新SDK包和AVD Manage负责创建管理虚拟机

 webapp运行环境配置

二、配置

2.1 用管理员身份启动SDK Manage,设置tools菜单->options->force前面勾上,如下图:

webapp运行环境配置

2.2 安装不同Android的SDK包

根据当前的需求选择安装不同的SDK.

webapp运行环境配置

点击install packges按钮进行安装,下一步选择Accept Lincense

webapp运行环境配置

安装是如果有提示如下:

webapp运行环境配置

处理如下:

webapp运行环境配置

在环境变量中添加上就可以了。

三、安装IONIC(官网http://ionicframework.com/docs/)

启动cmd,输入:npm install -g ionic(事先已经安装了node.js和npm)。

安装成功后输入:ionic –help,如果有如下输出就表示安装成功了。

 webapp运行环境配置

四、安装cordova

Cmd里输入:npm install –gcordova

安装成功输入:cordova –help有输出就标明安装成功了。

五、创建项目

安装完以上步骤后,就可以创建项目了,进入某个想创建项目的文件夹,在cmd输入:ionic start 项目文件夹名称 模版名称(模版名称可以是tabs, sidemenu, blank)。比如ionicstart mysidemenu sidemenu,(以下命令除了start命令,其他的都是在项目根目录)

如果有提示如下:

webapp运行环境配置

输入n既可

然后就会创建mysidemenu文件夹,里面创建了一大堆文件,www里面是我的源码,基本上你只需要修改这里面的文件

六、打包

打包前还需要在项目里设置支持的平台。可以添加android:在当前文件夹cmd输入:ionic platform add android(还可以添加ios、browser),每个项目添加一次就可以,以后再打包不许再添加。

如果有以下提示错误:

webapp运行环境配置

那么就需要把环境变量android_home指向android sdk的目录,比如我的SDK安装在了C:\Program Files (x86)\Android\android-sdk\platform-tools,那么cmd里运行 set android_home=C:\Program Files (x86)\Android\android-sdk。

这样是临时设置一个环境变量,只在当前的cmd里有效。也可以设置永久的环境变量:

webapp运行环境配置

如果还提示如下错误:

webapp运行环境配置

说明版本不兼容,需要api22的sdk版本,启动SDK Manager:

webapp运行环境配置

处理完以上错误后重新在cmd输入:ionic platform add android,把项目打包成android包(即.apk后缀的包名),成功后会在platforms\android\build\outputs\apk下生成如下的文件:

 webapp运行环境配置

这就表明打包成功。

七、在模拟环境中运行当前的打包文件

在运行打包文件前需要先选择模拟的设备,那么运行AVD Manage

 

打对勾的是必填,Device根据自己的需要选择要模拟的设备。

webapp运行环境配置

两种CPU可选,一种是arm,慢;另一种是x86,需要本机CPU支持虚拟化技术,我的笔记本不支持,用不了。

sd card的意思是,选择一个文件来模拟sd卡。

 

然后运行ionic emulate android,就会编译出apk,然后启动模拟器,然后把apk传入模拟器并启动apk。全是自动的。

这样就可以使用模拟器查看自己的成果了。

===========================================

 使用ionic state save命令,把项目的当前信息(状态)更新到这个文件 。
 如果以后把www之外的其他目录误删了,可以使用ionic state restore来重新生成其他必须的文件