ionic使用sass
sass 是一个css的预编译器,常见的预编译器有less,sass,stylus等,目前sass似乎更受青睐一些,bootstrap的最新版本以及ionic 都是用sass来构建页面效果的。这篇文章讲解如何在ionic工程使用sass。
1.首先需要在ionic项目中执行下面的命令:
ionic start CustomSass blank && cd CustomSass
ionic setup sass
注意:在执行这个命令的时候有可能会出错,然后就会提醒‘npm install -g gulp’,这时候按照提示执行这个命令,然后执行ionic setup sass就不会出错了。
2.执行完ionic setup sass之后,查看一下index.html,这时候它自动删除了ionic.css,以及style.css替换成ionic.app.css了
3.在ionic.project文件中添加:
"gulpStartupTasks": [
"sass",
"watch"
],
"watchPatterns": [
"www/**/*",
"!www/lib/**/*"
]
4.执行ionic serve,在ionic.app.scss中写你的sass;
5.也可以在ionic > scss文件夹下建立一个新的scss文件:_uouoho.scss,然后在ionic.scss文件下@import该文件:‘uouoho',接着在_uouoho.scss中写入sass就可以了。
ionic使用sass的更多相关文章
- ionic 启用sass
转入ionic项目目录,命令行下执行:ionic setup sass 提示编译器未装: You have specified Ionic CI to set up sass.However, you ...
- sass sublime text 2 gulp ionic
sass 安装1.全局安装 sass 我的Mac 所以不用再安装Ruby ,直接在终端输入 gem install sass 然后在终端中输入 sass -v 出现 Sass 3.4.8 (selec ...
- ionic中应用sass
在学习ionic过程中看到sass,总结了一下基本用法和问题解决办法1.首先需要一个ionic项目,并执行下面的命令ionic start CustomSass blank && cd ...
- ionic 项目中 使用 sass
注: 1.先安装node-sass -->> npm install --save node-sass --registry=https://registry.npm.taobao.or ...
- VS2015+cordova+ionic安装配置
VS2015已经出了正式版,想用来试一下cordova方面的开发.最近在看ionic这个框架,于是想能在VS2015里编辑js就好了. 下面说一下蛋疼的安装配置过程. 一.安装VS2015及Andro ...
- ionic常用命令记录
npm install -g ionic //安装ionic ionic lib update //更新www/lib/ionic 目录的文件,如有项目中有bower,此命令会运行bower upda ...
- hybird app(混合式app开发)cordova ionic 创建相应平台的app
hybird app(混合式app开发) 之ionic 框架平台 guide cordova 创建相应平台的app 1. npm install -g cordova //全局安装cordova-cl ...
- ionic添加scss
Setup Sass Automatically 在进行以下操作之前要确保node比较新,以便正确安装node-sass 或 改用cnpm install node-sass安装(淘宝源) $ ion ...
- Ionic常见问题
1.sh: 1: glxinfo: not found sudo apt-get update && sudo apt-get install mesa-utils 2.ionic s ...
随机推荐
- 广州项目实施步骤III_练习使用Keepalive保证HaProxy的高可用性
CentOS6.4 配置HAProxy+Keepalived 安装HAProxy请参考 http://www.cnblogs.com/kgdxpr/p/3272861.html 安装Keepali ...
- 从零开始学android开发-adt-bundle-eclipse下的修改android app名称
eclipse中,打开项目根目录中的AndoirManifest.xml文件,找到如下内容 <application android:allowBackup="true" a ...
- 使用命令行工具将Android应用转换成BlackBerry PlayBook应用
昨天写了篇文章关于Android应用转换的,通过BlackBerry的在线转换工具将Android应用转换成BlackBerry PlayBook应用.有网友反映说方法有点麻烦,所以今天补上新的转换方 ...
- 编辑器TP
http://www.itshipin.com/blog/archives/category/php/thinkphp
- ORACLE AUTOMATIC STORAGE MANAGEMENT翻译-第二章ASM Instance(4)完
ASM安全 这个小节主要描写叙述与ASM相关的各种安全配置话题,像 配置ASM须要的userids.groupids:ASM权限如 SYSOPER,SYSDBA和新的SYSASM权限,最后还有ASM ...
- 算法设计 - LCS 最长公共子序列&&最长公共子串 &&LIS 最长递增子序列
出处 http://segmentfault.com/blog/exploring/ 本章讲解:1. LCS(最长公共子序列)O(n^2)的时间复杂度,O(n^2)的空间复杂度:2. 与之类似但不同的 ...
- 项目源码--Android视频MV类网站客户端
下载源码 技术要点: 1.视频MV类网站客户端框架 2.底部TAB功能模块 3.用户管理模块 4.结合优质动画技术,良好的用户体验 5.用户设置模块 6.sqlite数据库灵活的应用 7.源码带有非常 ...
- Android 自定义组合控件
1, you need to add this kind of code to the constructors of your custom view which must extend ViewG ...
- 乐观锁(optimistic locking)与悲观锁(pessimistic locking)
首先,乐观锁(optimistic locking)与悲观锁(pessimistic locking)基本是针对数据处理来说,也就是跟数据库有关的术语,目的是为了解决并发处理时所遇到的相关性能问题,以 ...
- JSON使用——获取网页返回结果是Json的代码
public String getWebData(String strUrl){ String json = null; try { URL url = new URL(strUrl); HttpUR ...