Ionic快速安装教程
今天就让我们学习一下如何安装 Ionic 在自己的电脑上搭建一个简单的小应用。很多的网站上面都会写很复杂的安装方法,其实刚开始学习ionic的初学者,特别是没有很多编程经验的小伙伴是不是会吓跑了?感觉那么复杂需要安装什么node.js的环境啊、, 安装最新版本的cordova啊… … 其实不需要那么麻烦的。告诉大家我在做项目的时候怎么使用ionic的吧。
第一种方法:直接引入使用
第一步 、首先下载Ionic
ionic 最新版本下载地址:http://ionicframework.com/docs/overview/#download。
下载后解压压缩包,包含以下目录:
css/ => 样式文件
fonts/ => 字体文件
js/ => Javascript文件
version.json => 版本更新说明
你也可以在 Github 上下载以下资源文件:https://github.com/driftyco/ionic(在release 目录中)。
第二步 、引入文件
接下来,我们只需要在项目中引入以上目录中的 css/ionic.min.css 和 js/ionic.bundle.min.js 文件即可创建 ionic 应用。
<ion-header-bar class="bar-positive"> <h1 class="title">Hello World!</h1> </ion-header-bar> <ion-content> <p>我的第一个 ionic 应用。</p> </ion-content>
注意:在移动应用如 phonegap 中我们只需将对应的 js 和 css 文件加入到资源库中即可。
第二种方法:命令行安装
首先您需要安装 Node.js。然后通过命令行工具安装最新版本的 cordova 和 ionic 。通过参考Android 和 iOS 官方文档来安装。
Window 和 Linux 上打开命令行工具执行以下命令:
$ npm install -g cordova ionic
Mac 系统上使用以下命令:
sudo npm install -g cordova ionic
提示: IOS需要在Mac Os X. 和Xcode环境下面安装使用。
如果你已经安装了以上环境,可以执行以下命令来更新版本:
npm update -g cordova ionic
或
sudo npm update -g cordova ionic
创建应用
使用ionic官方提供的现成的应用程序模板,或一个空白的项目创建一个ionic应用:
$ ionic start myApp tabs
运行我们刚才创建的ionic项目
使用 ionic tool 创建,测试,运行你的apps(或者通过Cordova直接创建)。
创建android应用:
$ cd myApp
$ ionic platform add android
$ ionic build android
$ ionic emulate android
创建ios应用:
$ cd myApp
$ ionic platform add ios
$ ionic build ios
$ ionic emulate ios
相关文章
- 这篇文章主要介绍了基于Ionic3实现选项卡切换并重新加载echarts,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-09-24
- 这篇文章主要为大家详细介绍了Ionic默认的Tabs模板使用实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2016-09-01
- 本篇文章主要介绍了详解Windows下安装Nodejs步骤,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 ...2017-05-22
- Ionic 是目前最有潜力的一款 HTML5 手机应用开发框架。通过 SASS 构建应用程序,它 提供了很多 UI 组件来帮助开发者开发强大的应用。接下来小编给大家介绍如何安装 Ionic 在自己的电脑上搭建一个简单的小应用,感兴趣的朋友一起看看吧...2016-06-12
- 在日常项目开发中我们经常见到下拉刷新上拉加载的功能,接下来通过本文给大家介绍ionic如何实现下拉刷新与上拉加载的相关资料,需要的朋友可以参考下...2016-06-12
- 在项目中遇到表单似的页面,需要进行增加一行和减少一行的操作,基于ionic怎么实现呢?下面小编给大家分享ionic中列表项增加和删除的实现方法,一起看看吧...2017-01-26
- 本篇文章主要介绍了Mac下安装mysql5.7 完整步骤,具有一定的参考价值,有兴趣的可以了解一下,...2017-01-26
- 这篇文章主要介绍了在windows10上安装mysql详细图文教程,本文介绍的非常详细,具有参考借鉴价值,感兴趣的朋友一起看看吧...2016-09-18
- 今天工作中需要对一台ubantu的系统安装mysql,因为以前一直使用的是centos,虽然它也是类unix但是和redhat或centos命令上还是有点差别。所以通过网上查阅资料,终于安装成功了,现在将步骤分享给大家,有需要的朋友们可以参考借鉴。...2016-10-20
Ionic实现仿通讯录点击滑动及$ionicscrolldelegate使用分析
这篇文章主要介绍了Ionic实现仿通讯录点击滑动及$ionicscrolldelegate使用分析的相关资料,需要的朋友可以参考下...2016-01-21Ubuntu系统下的Nginx服务器软件安装时的常见错误解决
这篇文章主要介绍了Ubuntu系统下的Nginx服务器软件安装时的常见问题解决,包括彻底卸载Nginx的方法介绍,需要的朋友可以参考下...2016-05-22Windows Server 2012 R2 预览版安装全程图解
这篇文章主要介绍了Windows Server 2012 R2 预览版安装全程图解,需要的朋友可以参考下...2016-01-27- 这篇文章主要为大家详细介绍了Mysql5.7安装并修改初始密码的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2017-06-21
- Win server2003 IIS的安装方法,不论是卸载重新安装,还是初次安装都需要知道的。默认情况下iis是不安装的。...2016-01-27
- 这篇文章主要为大家详细介绍了ionic实现可滑动的tab选项卡切换效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2016-09-01
MySQL 5.6 (Win7 64位)下载、安装与配置图文教程
这篇文章主要介绍了MySQL 5.6 (Win7 64位)下载、安装与配置图文教程的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下...2016-08-23NPOINT免费虚拟主机管理系统windows2003的安装方法【图文】第1/2页
这是一款免费的虚拟主机管理系统,无限制,并可以二次开发...2016-01-27- 这篇文章主要介绍了Nginx安装与使用教程详解的相关资料...2016-09-28
- Node.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。本文给大家介绍Node.js插件安装的教程,非常实用,特此分享给大家,需要的朋友一起学习吧...2016-05-09
- 在我们装mysql数据库时,出现安装失败是一件非常令人烦恼的事情,接下来小编就给大家带来在我们安装mysql数据库失败的一些解决方法,感兴趣的小伙伴们可以参考一下...2016-05-20