搭建Iconic+angular混合APP开发环境

1.安装iconic cli

npm install -g ionic

-g意思是全局安装

ionic -v

2.创建项目

ionic start ionic-angular tabs --type=angular

–type=angular 是需要多加的参数，现在官方只集成好了angualr 或许以后就会有 --type=vue 或–type=react 呢

新建好项目后你会发现，与ionic2 ionic3项目它的目录结构变了。在ionic4 ，已更改为遵循每个受支持框架的建议设置。例如，如果某个应用程序正在使用Angular，那么该项目结构将与Angular CLI应用程序完全相同。

这是新建好后的目录结构，有angular项目经验的开发人员来说，这应该非常熟悉。

3.命令跑起来

npm run start

打开 http://localhost:4200 可以看到

4.检验java开发环境

在终端输入命令 java 或者 java -version检查本地是否安装java全局环境

如果没有安装，请到java官网下载安装

5.安装cordova

npm install -g cordova

检查cordova是否安装成功

cordova -v

5.安装android stadio

6.打包成安卓apk包

在项目命令行输入：

ionic cordova build android

在 \platforms\android\app\build\outputs\apk\debug 中找到 app-debug.apk 放到手机上即可安装测试

查看空项目打包之后的大小

安装到手机上，针对有刘海屏的手机，空项目没有做适配

这个问题后续做研究！

搭建Iconic+angular混合APP开发环境相关推荐

Vue + quasar-framework进行Vue混合app开发 ─ 模拟器选择及使用(四)
这里推荐2钟比较常用的模拟器,Genymotion和Android Studio自带的Android Virtual Device,至于喜欢用哪个就用哪个. Genymotion 需要准备下载的软件 ...
HTML5 APP开发环境的框架搭建
HTML5 APP开发环境的框架搭建转载:橘子博客 HTML5 开发APP需要一个开发框架和编译环境,参阅了相关资料后选择开源的PhoneGap.PhoneGap是一个开源的开发框架,使用HTML5 ...
Eclipse IDE 使用技巧和Android App 开发环境搭建和配置
写在前面: 本片文章只是记录了自己学习时的一些笔记,纯粹是为了自己后面方便查找,片言碎语,不适合大家浏览,请大家不要参考这篇文章. 正文: Eclipse IDE 使用技巧 ...
【快速开发App实战】BUI高仿网易新闻App系列一、搭建App开发环境和工作空间
一. 搭建App开发环境和工作空间前言我们的目标是要做一个真实的案例, 着重通过BUI框架及其相关工具的使用, 结合原生打包平台, 帮助大家理解一个App的开发过程. 以最新网易新闻的App为例, ...
html5混合app原理,HTML5混合App开发
内容简介在竞争激烈的移动互联网环境下,HTML5技术一直备受关注.HTML5混合App开发与原生App开发模式之间也争议不断.相对于原生App来说,HTML5混合App开发的成本更低.周期更短,而且 ...
混合app开发学习笔记
什么是混合移动App开发[重点] 苹果上的软件是如何开发出来的:使用的是 OC.或者使用Swift这门语言安卓平台上的软件又是如何开发出来的:使用安卓相关的语言开发的,Java,安卓的控件进行开发 ...
混合App开发，HBuilder开发移动App
使用HBuilder开发混合App: Hbuilder:是一个在线打包工具,不需要在本地配置开发环境:直接将做好的网站,通过一些简单的操作,就能在线打包为一个App: 混合APP开发常见技术:Html ...
从零搭建符合自己需求的开发环境
从零搭建符合自己需求的开发环境本文长期持续更新中,保持和自己实际开发环境一致,欢迎关注交流讨论! 前言这篇文章,一是总结自己,二是给新上道的小白一些思路,三是何时能重组大学时的EXplosion ...
搭建最新版本的Android开发环境
只为成功找方法,不为失败找借口! Android开发学习总结(一)--搭建最新版本的Android开发环境最近由于工作中要负责开发一款Android的App,之前都是做JavaWeb的开发,Andr ...