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 ...
随机推荐
- magiczoom 插件去版本(放大镜效果)
在放大镜效果中代码中有 Please upgrade to full version of Magic Zoom Plus™ 去除办法: 在 magiczoom 去版本 magiczoomplus.j ...
- 使用多个Worker的时候Odoo的系统日志配置
当我们开启Wokrer来启动Odoo的时候,用默认的日志会出现日志丢失的问题,这个是logger的问题:多个进程对单个文件写入日志.有一个简单的解决办法:配置openerp-server.conf,开 ...
- Map排序——按key排序,按value排序
注:转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/5959279.html 上一篇博文谈到了集合类的自定义排序方式,那么进一步扩展开来,与集合同等重要的Map有 ...
- HTML5中script的async属性异步加载JS
HTML5中script的async属性异步加载JS HTML4.01为script标签定义了5个属性: charset 可选.指定src引入代码的字符集,大多数浏览器忽略该值.defer 可 ...
- SOA服务开发小计
http://item.jd.com/11181846.html#comment SOA面向服务架构——SOA的概念 http://www.cnblogs.com/leslies2/archive/2 ...
- ab性能并发测试语法
ab测试语法ab -n 全部请求数 -c 并发数 测试url 例如:ab -n 10000 -c 1000 http://myweb.com/test.html Server Software: Ap ...
- c++中获取代码运行时间
include<ctime> time_t begin,end; begin=clock(); { .............//被测试的代码 } end=clock(); cout ...
- radvd.conf RADVD配置文件内容部分解析
interface eth0{ AdvSendAdvert on; #启用路由器公告(RA)功能 MinRtrAdvInterval ; #每隔30-100秒间隔发送公告消息 MaxRtrAdvInt ...
- C# 多线程处理相关说明: WaitHandle,waitCallback, ThreadPool.QueueUserWorkItem
class TestThread { static void Main() { //使用WaitHandle静态方法阻止一个线程,直到一个或多个同步对象接收到信号 WaitHandle[] waitH ...
- codeforces 377A. Puzzles 水题
A. Puzzles Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/problemset/problem/33 ...