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 ...
随机推荐
- 01WebApi防篡改机制---HMAC机制
防篡改,顾名思义就是防止有人恶意篡改请求数据URL以达到恶意攻击的目的,那要怎么才能实现这样的目的呢? 很简单,将要请求的数据加上合作号.合作Key按规则组织成一个字符串,获取对应的MD5摘要,然后将 ...
- 500 OOPS: vsftpd: both local and anonymous access
配置ftp服务器,有如下报错 C:\netos74\bin>ftp 10.20.100.252Connected to 10.20.100.252.500 OOPS: vsftpd: both ...
- Android 解析JSON格式数据
比起XML,JSON主要优势在于它的体积更小,在网络上传输的时候可以更省流量.但缺点在于,它的语义性较差,显示不如XML直观. JSON格式 : { "name_A" : &qu ...
- win7和ubuntu双系统删除ubuntu的方法
双系统,一般是先安装win7,再装ubuntu,开机用grub引导.假如装完双系统,某一天又想恢复使用windows怎么办呢? 也许你会说,直接用win7的磁盘管理工具,格式化ubuntu所在磁盘不就 ...
- 除Hadoop大数据技术外,还需了解的九大技术
除Hadoop外的9个大数据技术: 1.Apache Flink 2.Apache Samza 3.Google Cloud Data Flow 4.StreamSets 5.Tensor Flow ...
- pycharm 2016 注册码
43B4A73YYJ-eyJsaWNlbnNlSWQiOiI0M0I0QTczWVlKIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYXNzaWduZWVOYW1lIjoiI ...
- ocket.chat 使用 Meteor 开发的实时协作工具,类似 丁丁。
ocket.chat 使用 Meteor 开发的实时协作工具,类似 丁丁. https://rocket.chat/
- Shell 语法 if 、 case 、for 、 while、 until 、select 、repeat、子函数
if语法 : if [ expression ] then commandselif [ expression2 ] then commandselse commandsfi ...
- effective c++ resources
http://www.cnblogs.com/littlethank/archive/2011/12/15/2288787.html http://www.cnblogs.com/liao-xiao- ...
- 2.nodejs权威指南--Buffer
1. Buffer 1.1 创建 var buf1 = new Buffer(100); var buf2 = new Buffer([0,1,2]); var buf3 = new Buffer(' ...