ionic的安装
一.学习一样新的框架的步骤:
1.先找到人家的网站, 一个个点过来看看
2.我们前端的框架,分css与js
3.先学css 再学js
4.要学会复制黏贴代码, 实际演练代码的效果
二.ionic环境安装及ionic2安装链接 (vs2015)
1. Ionic的环境安装建立在node安装好的前提下
2. 安装JDK
http://www.oracle.com/technetwork/java/javase/downloads/index.html
配置环境变量
JAVA_HOME C:\Program
Files\Java\jdk1.8.0_111
Path
%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;
CLASSPATH .;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;
到命令行模式下 输入 java -version 如果
则证明已经安装好了
3. 安装sdk
下载sdk http://tools.android-studio.org/index.php/sdk
安装好之后,弹出一个界面
上面这个界面如何选择选项进行安装 参考这个页面:http://www.jianshu.com/p/ead6f56ddbbc
总共有6项需要安装, 安装之后 ANDROID_HOME C:\Program Files\andriod(安装路径)
Path:
%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools
测试有没有安装成功 在命令行模式下: android
-h
出现如下界面, 则安装成功
4. 安装ionic cordova 环境
cnpm install -g ionic cordova
安装成功之后如下测试
5. 下载app模板
1.先确定一个项目文件夹
比如到c:Develop下创建一个app文件夹;
2.在该文件夹下打开命令行窗口 输入 ionic start app1 就可以下载一套ionic app模板
6. 添加平台,到工程目录下(就是给我们下载模板,包一层原生app的皮) ionic platform add android
7. 打包成apk文件 ionic
build android
8. 需要连接上手机, 一般情况下要打开开发者模式,
再安装360手机助手, 点击apk就行了
补充:错误解决
1.如果输入java
-version 出现 client VM 则有可能是java虚拟机的位数装错了
解决方法:只需要重新下载一个64位的jdk
2.如果出现如下所示问题,
问题描述: 这是在操作第六步 添加平台的时候,出现的问题
解决方法: 自己查英文, 这个错误是说, 我们缺少android sdk
platform 24; 只需要再下载一遍; 打开SDK Manager.exe
解决方法: 自己查英文, 这个错误是说, 我们缺少android sdk platform 24; 只需要再下载一遍; 打开SDK
Manager.exe
还得删除自己项目目录下的(并不是android SDK目录下)下载没有完全完成的 platforms文件夹; 然后 就是命令行模式 再重复第六步
3.出现如下问题
解决方法:将系统变量下 Path: 改回来了 值为
C:\ProgramData\Oracle\Java\javapath;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Git\cmd
环境变量安装总结: 1. nvm--->node版本控制 (需要到github上面找nvm)
2.JDK 1.8版本以上的
3.android sdk 需要安装platform
r24版本以及其他5个选项
4.需要安装ionic
cordova npm install -g ionic cordova
个人环境配置:
前提1. nvm解码在C:\Develop\nvm-noinstall
前期2. Android sdk 安装在C:\Program
Files\andriod
NVM_HOME
C:\Develop\nvm-noinstall
NVM_SYMLINK C:\Develop\nodejs
NPM_HOME
C:\Users\Administrator\node_modules\.bin
JAVA_HOME
C:\Program Files\Java\jdk1.8.0_111
CLASSPATH
.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;
ANDROID_HOME C:\Program Files\andriod
个人path值:
%NVM_HOME%;%NVM_SYMLINK%;%NPM_HOME%;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools;C:\Program
Files\Git\cmd
系统path值:
C:\ProgramData\Oracle\Java\javapath;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program
Files\Git\cmd
ionic2:
http://www.tuicool.com/articles/vI3ieyn
https://yanxiaodi.gitbooks.io/ionic2-guide/content/installation/%E5%AE%89%E8%A3%85Node.html
http://taco.visualstudio.com/en-us/docs/tutorial-ionic2/
ionic的安装的更多相关文章
- MAC OSX环境下cordova+Ionic的安装配置
一.简介 1.Ionic是什么 IONIC 是目前最有潜力的一款 HTML5 手机应用开发框架.通过 SASS 构建应用程序,它提供了很多 UI 组件来帮助开发者开发强大的应用. 它使用 JavaSc ...
- 关于Ionic的安装
Ionic是一个前端的框架,帮助开发者使用HTML5, CSS3和JavaScript做出原生应用. http://ionicframework.com/getting-started/ 这里介绍了如 ...
- npm 安装卸载模块 & ionic插件安装与卸载
npm安装模块 npm install xxx利用 npm 安装xxx模块到当前命令行所在目录 npm install -g xxx利用npm安装全局模块xxx 本地安装时将模块写入package.j ...
- Ionic 的安装运行
1.学习前准备工作 1.必须得安装 nodejs (建议安装最新的稳定版本) 2.必须有 Angular 基础:https://www.loaderman.com/goods-1047.html 2. ...
- OSX cordova+Ionic的安装配置
0.安装前确定你的系统安装了node和xcode 1.cordova (1)安装cordova npm config set registry http://registry.cnpmjs.org s ...
- ionic cordova 安装指定版本
安装ionic 及 cordova npm install -g cordova ionic npm 淘宝镜像(GFW,导致很多插件下载失败) npm install -g cnpm --regist ...
- ionic插件安装与卸载
使用下面的命令查询.安装.卸载插件: $ ionic plugin list //列出所有已安装插件 $ ionic plugin remove 插件名 //先根据上面的list列出插件,然后根据插件 ...
- win10 nodejs指定ionic版本安装(npm方式)
步骤1 node-v6.11.3-x64.msi 下载安装node-v6.11.3-x64.msi, 安装完成后利用cmd通过npm安装 ionic cordova cmd npm install - ...
- window下Ionic环境安装
安装以下文件 1.java.jdk 2apache ant 3.android skd 4.node 目前是这几个. 大该流程就是这样子的. Ionic官方教程: http://learn.ioni ...
随机推荐
- JS效果的步骤
一.写JS效果的步骤 1.先实现布局 (XHTML+CSS2) 2.实现原理 (1)希望把某个元素移除你的视线: a. display:none; 显示为无,不占据空间 b. vi ...
- spring mvc 注解示例
springmvc.xml <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=" ...
- 触摸滑动插件 Swiper
Swiper Swiper 是纯javascript打造的滑动特效插件,面向手机.平板电脑等移动终端. Swiper中文网里已有详细的使用介绍,我就不多做介绍了. http://www.swiper ...
- 对angularjs时间过滤格式
在最近的项目中,我遇到这样的一个小问题,从后台传过来一个时间值,格式如下: "/Date(1484743002000)/" 至于为什么是这种格式,后台的开发说数据库中就是这个存的( ...
- .NET 通用高扩展性的细粒度权限管理架构(webApi/Mvc)
一. 权限场景分析: 1. 系统具有角色概念, 部门概念, 且都具有相应不同的权限 2. 用户具有多个角色, 多个部门等关系, 并且能给单个用户指派独有的权限 3. 具有细粒度权限控制到资源的RBAC ...
- mac bash_profile
# This is the filename where your incoming mail arrives. MAIL=~/mbox MAILCHECK=30 HISTFILE=~/.histor ...
- [html5] 学习笔记-Canvas应用
通过使用HTML5游戏开发的引擎CreatJS,创建HTML5 Canvas上的更好交互. 1.认识CreateJS CreateJS是一个外部库,用它可以比Canvas更方便的绘制图形. 官网:ht ...
- 服务器部署项目出现问题:Unsupported major.minor version 52.0
问题描述: 编写一个web 前置服务,使用ant编译项目,将项目部署到服务器上,启动时报此错误:Unsupported major.minor version 52.0 网上给出错误原因是服务器安装的 ...
- UITableView、UICollectionView行高/尺寸自适应
UITableView 我们都知道UITableView从iOS 8开始实现行高的自适应相对比较简单,首先必须设置estimatedRowHeight给出预估高度,设置rowHeight为UITabl ...
- oozie配置安装与原理
概述 当前开源的hadoop任务工作流管理主要有oozie和Azkaban,本文先介绍oozie的配置安装与基本运行原理. 配置安装 (参考https://segmentfault.com/a/11 ...