Ionic环境搭建
stepts
npm install -g ionic@beta
Make sure you have NodeJS installed. Download the installer here or use your favorite package manager. It’s best to get the 5x version of node along with the 3x version of npm. This offers the best in stability and speed for building.
Once that’s done, create your first Ionic app:
ionic start cutePuppyPics --v2
To run your app, cd into the directory that was created and then run the ionic serve command:
$ cd cutePuppyPics
$ ionic serve
You can play with it right in the browser!

Building to a Device
After you have Ionic installed, you can build your app to a physical device. If you don’t have a physical device on hand, you can still build to a device emulator. Check out the iOS simulator docs if you are on a Mac, or the Genymotion docs if you are looking to emulate an Android device. You will also need Cordova to run your app on a native device. To install Cordova, run:
$ sudo npm install -g cordova
Building for Android
To build for Android, you’ll need to add the Android platform module to Cordova:
$ ionic platform add android
Next, you’ll need to install the Android SDK. The Android SDK allows you to build compile to a target device running Android. Although the Android SDK comes with a stock emulator, Genymotion is recommended, since it’s much faster. Once installed, start an Android image and run:
$ ionic run android
Problems
problem1
As a common cause for Chinese programmers,the existence of GFW will make it hard for us to dowlad gradles
solutions:
- dowload specificed version gradle from Internet.
- paste it in somewhere likes myApp\platforms\android\gradle\gradle-2.2.1-all.zip
- change distributionUrl in myApp/platforms/android/cordova/lib/builders/GradleBuilder.js
from
var distributionUrl = 'distributionUrl=http\\://services.gradle.org/distributions/gradle-2.2.1-all.zip';
to
var distributionUrl = 'distributionUrl=../gradle-2.2.1-all.zip';
references
ionic build android error when download gradle - Stack Overflow
problem2
ionic serve opened a blank page
solutions:
change your browse,firefox or chorme will be fine.
problem3
EveryTime I run ionic run android,the code will go back to the original and don’t change.
solutions:
there are three directory have page htmls
- app/
- www/
- android/
please edit code in app directory and it will work well.
Ionic环境搭建的更多相关文章
- ionic环境搭建及新建项目中的各种问题
具体流程可见http://bbs.ionic-china.com/read-7.html 问题1.安装ionic cordova失败 解决方法:修改npm的源,npm config set regis ...
- Ionic 入门与实战之第二章第一节:Ionic 环境搭建之开发环境配置
原文发表于我的技术博客 本文是「Ionic 入门与实战」系列连载的第二章第一节,主要对 Ionic 的开发环境配置做了简要的介绍,本文介绍的开发环境为 Mac 系统,Windows 系统基本类似,少许 ...
- ionic环境搭建和安装
1. 安装node环境 nodeJs环境的安装很简单,去官网下载最新版的NodeJs直接安装即可. Node官网: https://nodejs.org/ 安装完成后配置环境变量,计算机->属性 ...
- ionic 环境搭建
1.安装nodejs (8.4.0) 下载地址 https://nodejs.org/zh-cn/ 2.Java jdk 版本号 jdk1.8.0_121 3.安装 cordova npm ins ...
- 第三章:ionic环境搭建之windows篇
下面是在windows操作系统上面安装ionic的步骤,已经在Windows 10/ 7/ XP下面通过验证. 安装JDK 1.1 下载(http://www.oracle.com/technetwo ...
- Ionic 入门与实战之第二章第二节:Ionic 环境搭建之 Ionic Lab 使用
原文发表于我的技术博客 本文是「Ionic 入门与实战」系列连载的第二章第二节,主要对 Ionic Lab 工具作了介绍,并讲解了其使用方法,这也是一个开发 Ionic 比较好的调试工具. 原文发表于 ...
- Ionic01 简单介绍、环境搭建、创建项目、项目结构、创建组件、创建页面、子页面跳转
1 Ionic 基本介绍 Ionic 是一款基于 Angular.Cordova 的强大的 HTML5 移动应用开发框架 , 可以快速创建一个跨平台的移动应用.可以快速开发移动 App.移动端 WEB ...
- Cordova+ionic 开发hybird App --- 开发环境搭建
Cordova 开发hybird App 开发环境搭建 一.一些基础概念: Ant : 简单说来可以这么理解,如果你用记事本写JAVA程序,然后在cmd里输入javac命令编译它,但是有一天你发现每次 ...
- Ionic 开发环境搭建
android sdk环境搭建并非易事,本人经过无数失败,才使用以下方式成功 配置Ionic 开发环境 1.下载JDK并配置Java运行环境 http://www.oracle.com/technet ...
随机推荐
- vncserver和Ubuntu Xfce4远程桌面环境的配置,解决不显示图形界面
vncserver和Ubuntu Xfce4远程桌面环境的配置 参考的http://blog.163.com/thinki_cao/blog/static/8394487520130301453180 ...
- html5 图片转为base64格式异步上传
因为有这个需求(移动端),所以就研究了一下,发现还挺不错的.这个主要是用了html5的API,不需要其他的JS插件,不过只有支持html5的浏览器才行,就现在而言应该大部份都支持的.<!DOCT ...
- Leonbao:MapKit学习笔记
以下仅作了解, 实际使用以百度地图居多, 因为百度地图有动态路径规划等接口 MapKit学习笔记 原帖: http://www.cocoachina.com/bbs/read.php?tid-6 ...
- 我对windows消息机制的理解(参考深入浅出MFC,欢迎批评指正!!)
以消息为基础,以事件驱动之 程序的进行依靠外部消息来驱动,即:程序不断等待任何可能的输入,然后做判断,然后再做适当的处理. 消息输入:操作系统捕获,以消息形式进入程序.(操作系统通过其USERS模块中 ...
- Java学习之强引用,弱引用,软引用 与 JVM
1.java内存管理分为内存分配和内存回收,都不需要程序员负责. 2.垃圾回收的机制主要是看对象是否有引用指向该对象. java对象的引用包括 强引用 软引用 弱引用 虚引用 3.强引用 是指创建 ...
- 编码(Code)
很遗憾,直接搜索Code或者编码是很难得找到这本书的,我也是无意中才接触到本书. 第一次读本书,对各方面的知识都不算很懂,觉得很多地方都写的太多浅显,好像本该就是这样子,一个编码系统说的那么麻烦干嘛, ...
- 思科 vlan 相关操作
添加或者修改VLAN Switch(config)# vlan vlan-id Switch(config-vlan)# name vlan-name 删除VLAN Switch(config)# n ...
- Kali Linux渗透基础知识整理(二)漏洞扫描
Kali Linux渗透基础知识整理系列文章回顾 漏洞扫描 网络流量 Nmap Hping3 Nessus whatweb DirBuster joomscan WPScan 网络流量 网络流量就是网 ...
- HDU 2861 四维dp打表
Patti and Terri run a bar in which there are 15 stools. One day, Darrell entered the bar and found t ...
- MySQL重复数据
delete from porn where Id not in (select minid from (select min(id) as minid from porn group by view ...