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

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

下载node.js环境,稳定版本:v6.9.5 下载android studio: android-studio-bundle-145.3360264-windows.exe包含 Android SDK,打开出现问题进行如下操作:

到控制台安装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目录下) 新建项目

可以自己建立workspace,然后cd到该目录下创建项目

ionic start MyIonic2Project tutorial –v2 (若要建立tabs项目,将tutorial改为tabs即可)

可能会失败,出现如下信息:

说明npm安装失败了,可以cd到项目目录,改用cnpm重新进行安装

cnpm install

出现如下信息则安装成功:

列表内容

运行项目

ionic serve

浏览器上面访问在提示的ip,即可出现项目效果:

此时只能看到浏览器模式,若想在浏览器上查看手机上面的样式,有以下两种方法:

a.在谷歌浏览器上,按F12进入调试模式,然后再按ctrl+Shift+M即可进入手机调试模式;

b.在谷歌浏览器上进入应用商店安装插件Ripple,即可模拟出手机模式。

这里更推荐使用第二种模式,因为该模式模拟原生的手机模式,更贴近手机应用环境。 打包apk

需要先安装jdk,sdk,并分别配置环境变量,jdk版本1.8以上(注意:在MAC下是不需要进行环境变量的配置的)

运行命令:

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左右。

Ionic2开发环境搭建、项目创建调试与Android应用的打包、优化的更多相关文章

  1. Ionic2开发环境搭建-VS 2017

    原文:Ionic2开发环境搭建-VS 2017 目前在VS 2017中创建Ionic2版本项目 注:在VS中开发Ionic项目,使用的Ionic(v2.x),Cordova(v6.3.1),Angul ...

  2. spark JAVA 开发环境搭建及远程调试

    spark JAVA 开发环境搭建及远程调试 以后要在项目中使用Spark 用户昵称文本做一下聚类分析,找出一些违规的昵称信息.以前折腾过Hadoop,于是看了下Spark官网的文档以及 github ...

  3. Ionic2开发环境搭建

    关于网络环境:ionic开发环境不需要FQ.我这里没有设置FQ,亲测可行.但是angular2的开发环境搭建,则需要FQ网络,否则很多包会安装失败. 建议大家在搭建开发环境的时候,不要参考百度出来的各 ...

  4. Ionic2 开发环境搭建

    Ionic2开发环境要求: Nodejs V4.5.0 Nodejs自带 Npm V2.15.9 同上 Ionic V2.1.0 安装最新ionic即可 Angular2 V2正式版 同上 说明:以上 ...

  5. Android开发环境搭建全程演示(jdk+eclipse+android sdk)

    全程演示android开发环境的搭建过程,无需配置环境变量.所有软件都是写该文章时最新版本 一 相关下载 (1) java JDK下载: 进入该网页: http://java.sun.com/java ...

  6. vue.js开发环境搭建以及创建一个vue实例

    Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...

  7. CUDA并行程序设计 开发环境搭建与远程调试

    课题需要用到GPU加速.目前使用的台式电脑只有核心显卡,而实验室有一台服务器装有NVIDIA GTX980独显.因此,想搭建一个CUDA的开发环境,来实现在台式机上面开发cuda程序,程序在服务器而不 ...

  8. Cordova 开发环境搭建及创建第一个app

    整理记录使用cordova创建app应用程序并将其部署至Android系统移动设备上操作过程,具体如下: 一.前期安装环境 1. 安装JDK(java开发工具包) 2. 安装gradle 3. 安装A ...

  9. Go 开发环境搭建和代码调试

    写这篇笔记的目的,主要是分享我在Go学习中遇到的坑.让后面的学习者能否参考有用的经验. 其中有一些小技巧,对初学者来说,可能会大大节约填坑的时间. 比如如何设置vscode的Go调试器,Go的语法高亮 ...

随机推荐

  1. 微信小程序发起微信支付

    点击链接查看详情:(支付中配置参数需要从后台得到->签名需要从微信申请才可以得到) https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-pay.h ...

  2. STLC - 软件测试生命周期

    什么是软件测试生命周期(STLC)? 软件测试生命周期(STLC)定义为执行软件测试的一系列活动. 它包含一系列在方法上进行的活动,以帮助认证您的软件产品. 图 - 软件测试生命周期的不同阶段 每个阶 ...

  3. Web 自动化测试框架 sweetest 介绍

    项目开源: https://github.com/tonglei100/sweetest 文章转载:https://segmentfault.com/a/1190000011612061 介绍 swe ...

  4. 『Github』简易使用指南

    一.新建repository 新建项目从下图位置开始, 当我们完成了初始化后,找不到创建/上传文件的位置,只需如下操作, 然后, 即可,当然,按照下图提示进行命令行操作实际是一样的, 创建了READM ...

  5. 【IDEA】【6】Maven打包

    1,打包成jar包 右侧工具栏Maven Projects->项目名称->Lifecycle->package 2,打包时去掉test 右侧工具栏Maven Projects,打开后 ...

  6. React Router页面传值的三种方法

    文章地址:https://blog.csdn.net/qq_23158083/article/details/68488831

  7. git回退代码到某次commit

    回退命令: $ git reset --hard HEAD^ 回退到上个版本 $ git reset --hard HEAD~3 回退到前3次提交之前,以此类推,回退到n次提交之前 $ git res ...

  8. csu oj 1341 string and arrays

    Description 有一个N*N的字符矩阵,从上到下依次记为第1行,第2行,……,第N行,从左至右依次记为第1列,第2列,……,第N列. 对于这个矩阵会进行一系列操作,但这些操作只有两类: (1) ...

  9. Create JSON by Jackson API(转)

      原文地址: Create JSON by Jackson API Jackson API is a multi-purpose Java library for processing JSON. ...

  10. Python函数基础-函数调用,定义,参数,递归

    Python内置了很多函数供调用,eg 求绝对值函数abs() >>>abs(-1) 1 >>>abs(1) 求和函数sum(),sum(iterable,star ...