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

阅读: 评论:0

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

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

中文参考文档:/
Ionic2项目源码:

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

  1. 下载node.js环境,稳定版本:v6.9.5
  2. 下载android studio: 包含 Android SDK,打开出现问题进行如下操作:
  3. 到控制台安装ionic2和Cordova
    首先更换淘宝镜像,下载起来会快很多,使用时需要将npm命令换成cnpm
    npm install -g cnpm –registry=
    安装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与服务器进行异步通信的方法)

本文发布于:2024-02-03 04:00:06,感谢您对本站的认可!

本文链接:https://www.4u4v.net/it/170690400448508.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

标签:环境   项目   Android
留言与评论(共有 0 条评论)
   
验证码:

Copyright ©2019-2022 Comsenz Inc.Powered by ©

网站地图1 网站地图2 网站地图3 网站地图4 网站地图5 网站地图6 网站地图7 网站地图8 网站地图9 网站地图10 网站地图11 网站地图12 网站地图13 网站地图14 网站地图15 网站地图16 网站地图17 网站地图18 网站地图19 网站地图20 网站地图21 网站地图22/a> 网站地图23