Ionic2开发环境搭建、项目创建调试与Android应用的打包、优化

本文主要是介绍Ionic2开发环境搭建、项目创建调试与Android应用的打包、优化,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

中文参考文档:https://yanxiaodi.gitbooks.io/ionic2-guide/content/introduction/
Ionic2项目源码:https://github.com/driftyco/ionic

windows下ionic2开发环境配置步骤如下:

  1. 下载node.js环境,稳定版本:v6.9.5
  2. 下载android studio: android-studio-bundle-145.3360264-windows.exe包含 Android SDK,打开出现问题进行如下操作:
    这里写图片描述
  3. 到控制台安装ionic2和Cordova
    首先更换淘宝镜像,下载起来会快很多,使用时需要将npm命令换成cnpm
    npm install -g cnpm –registry=http://registry.npm.taobao.org
    安装ionic2:npm install -g ionic (查看:ionic -version 卸载:npm uninstall -g ionic)
    安装Cordova:npm install -g cordova(查看:cordova -version)
    (两者默认安装路径的是在C盘下的user目录下)
  4. 新建项目
    可以自己建立workspace,然后cd到该目录下创建项目
    ionic start MyIonic2Project tutorial –v2 (若要建立tabs项目,将tutorial改为tabs即可)
    可能会失败,出现如下信息:
    这里写图片描述
    说明npm安装失败了,可以cd到项目目录,改用cnpm重新进行安装
    cnpm install
    出现如下信息则安装成功:
    这里写图片描述
  5. 列表内容
    运行项目
    ionic serve
    这里写图片描述
    可浏览器上面访问在提示的ip,即可出现项目效果:
    这里写图片描述
    此时只能看到浏览器模式,若想在浏览器上查看手机上面的样式,有以下两种方法:
    a.在谷歌浏览器上,按F12进入调试模式,然后再按ctrl+Shift+M即可进入手机调试模式;
    这里写图片描述
    b.在谷歌浏览器上进入应用商店安装插件Ripple,即可模拟出手机模式。
    这里写图片描述
    这里更推荐使用第二种模式,因为该模式模拟原生的手机模式,更贴近手机应用环境。
  6. 打包apk
    需要先安装jdk,sdk,并分别配置环境变量,jdk版本1.8以上
    运行命令:
    cordova platform add android
    (重新添加android环境时用到:cordova platform rm android)
    ionic build android
    成功build后在控制台提示的目录下可以找到项目生成的APK,传到手机上安装即可。
    7.apk性能优化
    通过Ionic2打包后的Android应用在手机上可能会出现卡顿等情况,此时可以给应用添加crosswalk环境,此方法将浏览器内核打包进入apk,使应用的流畅程度大大增加(在android5.0以下应用中体现得尤为明显)。此方式打包apk的缺点是会使apk的大小增加20M左右。
    添加crosswalk:
    cordova plugin add cordova-plugin-crosswalk-webview
    cordova build android
    打包web内核进入app,体积换取app流畅度
    (下一节总结Ionic2与服务器进行异步通信的方法)

这篇关于Ionic2开发环境搭建、项目创建调试与Android应用的打包、优化的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/481812

相关文章

Python列表的创建与删除的操作指南

《Python列表的创建与删除的操作指南》列表(list)是Python中最常用、最灵活的内置数据结构之一,它支持动态扩容、混合类型、嵌套结构,几乎无处不在,但你真的会创建和删除列表吗,本文给大家介绍... 目录一、前言二、列表的创建方式1. 字面量语法(最常用)2. 使用list()构造器3. 列表推导式

Agent开发核心技术解析以及现代Agent架构设计

《Agent开发核心技术解析以及现代Agent架构设计》在人工智能领域,Agent并非一个全新的概念,但在大模型时代,它被赋予了全新的生命力,简单来说,Agent是一个能够自主感知环境、理解任务、制定... 目录一、回归本源:到底什么是Agent?二、核心链路拆解:Agent的"大脑"与"四肢"1. 规划模

JAVA项目swing转javafx语法规则以及示例代码

《JAVA项目swing转javafx语法规则以及示例代码》:本文主要介绍JAVA项目swing转javafx语法规则以及示例代码的相关资料,文中详细讲解了主类继承、窗口创建、布局管理、控件替换、... 目录最常用的“一行换一行”速查表(直接全局替换)实际转换示例(JFramejs → JavaFX)迁移建

JavaWeb项目创建、部署、连接数据库保姆级教程(tomcat)

《JavaWeb项目创建、部署、连接数据库保姆级教程(tomcat)》:本文主要介绍如何在IntelliJIDEA2020.1中创建和部署一个JavaWeb项目,包括创建项目、配置Tomcat服务... 目录简介:一、创建项目二、tomcat部署1、将tomcat解压在一个自己找得到路径2、在idea中添加

解决idea启动项目报错java: OutOfMemoryError: insufficient memory

《解决idea启动项目报错java:OutOfMemoryError:insufficientmemory》:本文主要介绍解决idea启动项目报错java:OutOfMemoryError... 目录原因:解决:总结 原因:在Java中遇到OutOfMemoryError: insufficient me

Java利用Spire.Doc for Java实现在模板的基础上创建Word文档

《Java利用Spire.DocforJava实现在模板的基础上创建Word文档》在日常开发中,我们经常需要根据特定数据动态生成Word文档,本文将深入探讨如何利用强大的Java库Spire.Do... 目录1. Spire.Doc for Java 库介绍与安装特点与优势Maven 依赖配置2. 通过替换

Android使用java实现网络连通性检查详解

《Android使用java实现网络连通性检查详解》这篇文章主要为大家详细介绍了Android使用java实现网络连通性检查的相关知识,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录NetCheck.Java(可直接拷贝)使用示例(Activity/Fragment 内)权限要求

python项目环境切换的几种实现方式

《python项目环境切换的几种实现方式》本文主要介绍了python项目环境切换的几种实现方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一... 目录1. 如何在不同python项目中,安装不同的依赖2. 如何切换到不同项目的工作空间3.创建项目

SpringBoot项目整合Netty启动失败的常见错误总结

《SpringBoot项目整合Netty启动失败的常见错误总结》本文总结了SpringBoot集成Netty时常见的8类问题及解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参... 目录一、端口冲突问题1. Tomcat与Netty端口冲突二、主线程被阻塞问题1. Netty启动阻

python项目打包成docker容器镜像的两种方法实现

《python项目打包成docker容器镜像的两种方法实现》本文介绍两种将Python项目打包为Docker镜像的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要... 目录简单版:(一次成功,后续下载对应的软件依赖)第一步:肯定是构建dockerfile,如下:第二步