`

ionic学习

    博客分类:
  • app
 
阅读更多
1.准备工作
    下载 Node.js(下载包),WebStorm(IDE,编写代码,浏览器调试),JDK(webstorm 运行环境),Android SDK (Android编译)
2.配置环境变量:
  1. ANDROID_HOME    D:\Program Files\adt\sdk                              (对应sdk路径)  
  2.        path     %ANDROID_HOME%\platform-tools;  
  3.        path     %ANDROID_HOME%\tools;  

3.安装ionic等,运行命令提示符(管理员) 输入

 

    a. cordova和ionic包安装到全局环境中(可供命令行使用):

 

  1. npm install -g cordova ionic  

              注:由于GFW,很多插件下载不下来,我们可以使用淘宝镜像来解决这个问题:

 

  1. npm install -g cnpm --registry=https://registry.npm.taobao.org  

              安装完成后,以后所有的插件都使用cnpm这个命令来进行安装。

  1. cnpm install -g ionic cordova  

    b. 进入你要创建项目的路径:

 

  1. cd E:\Study\Android\ionic\Project  
  2. e:  
    c. 创建一个名为myApp的还有tabs的项目(ionic start <project-name> <optional-template> 可选模板为sidemenu 侧滑、tabs 底部tab切换、blank 空白):
  1. ionic start myApp tabs  
    d. myApp就为项目名称,进入myApp这个文件夹:
  1. cd myApp  
    e. 添加android平台:
  1. ionic platform add android  
    f. 生成androidapk:
  1. ionic build android  
    g. 在android模拟器或真机中模拟:
  1. ionic emulate android  

   其中f和g可以合并为:

  1. ionic run android  

    即生成apk,并在模拟器或真机中模拟。

 

4.更新ionic

    a.更新cordova及ionic包

 

  1. npm update -g cordova ionic  
    b.更新已建ionic项目中的js类库,命令行中先进入项目所在目录,然后运行:

 

  1. ionic lib update  

5.展现ionic项目结果(显示在ios和android上的样式)

 

  1. ionic serve --lab  

6.查看ionic版本(当前最新版本为1.2.13)

  1. ionic -v  

 



 

  • 大小: 118.3 KB
分享到:
评论

相关推荐

    ionic学习记录总结

    ### ionic学习记录总结 #### 一、Ionic基础安装与配置 **1. 安装Cordova和Ionic:** 在开始使用Ionic之前,首先需要安装Node.js环境,然后通过npm(Node.js包管理器)来安装Cordova和Ionic。具体命令如下: ```...

    Ionic学习手册

    《Ionic学习手册.pdf》,照片版,2017年6月份的书。有简单的目录,完整版

    ionic 学习

    **Ionic 学习指南** Ionic 是一个开源的框架,用于构建高性能、跨平台的移动应用程序。它基于 Angular 框架,并使用 Web 技术(HTML、CSS 和 JavaScript)进行开发,同时支持原生功能的集成。对于新手来说, Ionic ...

    ionic学习导图.itmz

    ionic学习记录思维导图,开发环境搭建-&gt;开发工具选择-&gt;ionic常见问题处理及方案

    ionic学习示例

    【Ionic学习示例】 在移动应用开发领域,Ionic框架是一个非常流行的选择,它基于Angular,提供了丰富的组件和工具,使得开发者能够快速构建跨平台的原生感观的移动应用。这个"ionic学习示例"旨在帮助你理解如何在...

    ionic-lessons:ionic学习笔记 (ionic中文版教程)

    #ionic学习笔记 (ionic中文版教程) ##ionic 概述 ionic是一个强大的混合式/hybrid app移动开发框架。可以帮助您使用 Web 技术,比如 HTML、 CSS 和Javascript 构建接近原生体验的移动应用程序。目前已发布正式版本。...

    ionic学习笔记

    ionic学习的笔记,现在有环境的安装,echarts的调用,百度地图的调用,懒加载的实现。

    ionic 知识

    - [CSDN博客](https://blog.csdn.net/strong90/article/details/78892674):提供了关于Ionic学习的大量资料和教程。 #### 六、开发环境配置 1. **Node.js**:安装最新版本的Node.js,以便支持Ionic和其相关插件。 ...

    Ionic学习日记实现验证码倒计时

    在本文中,我们将探讨如何在使用Ionic框架开发应用程序时实现验证码倒计时功能。...在开发过程中,不断学习和实践是提升技能的关键,希望这个例子能帮助你在 Ionic 开发过程中更好地理解和应用验证码倒计时功能。

    ionic2 new demo

    本文将深入探讨基于`Ionic2`框架开发的Android应用示例,该示例被称为"Ionic2 new demo"。这个项目旨在帮助开发者快速掌握`Ionic2`框架,了解如何利用其特性构建功能丰富的移动应用程序,特别是涉及到下拉框...

    ionic购物商城demo源码

    本篇文章将深入探讨一款使用Ionic框架开发的简单购物商城Demo,旨在为开发者提供一个学习和实践的平台,同时也欢迎各位提出宝贵的建议,共同促进技术的进步。 Ionic是一款开源的HTML5移动应用框架,它允许开发者...

    ionic2入门学习PPT

    ### ionic2入门知识点概述 本篇文档针对的是Ionic2框架的初学者,旨在通过简明扼要的方式介绍Ionic2的基础知识与环境搭建流程。...这些基础知识点对于理解Ionic2的工作原理以及后续进阶学习至关重要。

    完整的Ionic项目实例

    【Ionic项目实例详解】 本文将深入探讨一个名为“ddcanzuo”的完整Ionic项目实例,该实例已经过Cordova编译处理,适用于个人自学。在理解这个项目之前,我们需要先了解 Ionic 和 Cordova 这两个关键的技术框架。 *...

    ionic3仿京东商城源码

    本篇文章将深入探讨一个使用Ionic3开发的仿京东商城源码,这对于想要学习和掌握Ionic3技术的开发者来说,无疑是一份极其宝贵的参考资料。 首先,我们来看这个源码的基础配置文件。`.editorconfig`是代码风格配置...

    前端-ionic-官网教程学习项目photo-gallery

    【标题】"前端-ionic-官网教程学习项目photo-gallery"是一个基于Ionic框架的前端应用示例,主要用于展示如何使用Ionic进行照片画廊的开发。这个项目可能是为了帮助开发者熟悉Ionic框架,尤其是涉及到UI组件和媒体...

    ionic模版源代码

    《深入理解Ionic框架:基于Angular的移动应用开发》 Ionic是一款强大的开源框架,专为构建高性能的混合移动应用而设计。它充分利用了Angular的强大...在实践中不断探索和学习,将使你成为Ionic和Angular开发的专家。

    ionic-best-practices.pdf_ionic_

    6. **测试和调试**:学习单元测试、端到端测试的编写,以及使用Chrome开发者工具等进行调试的方法。 7. **部署和发布**:了解如何将应用打包为APK或IPA,以及在Google Play Store和Apple App Store上的发布流程。 ...

    Building Mobile Apps with Ionic 2 final2.0 (附项目源码)

    《构建移动应用 with Ionic 2 final2.0》是一份深度探讨使用Ionic 2框架开发移动应用程序的资源,其中包含了完整的项目源码供学习者参考。Ionic 2是一款基于Angular的开源框架,专为构建高性能的混合移动应用而设计...

Global site tag (gtag.js) - Google Analytics