compass和sass文章列表:http://182.92.240.72/tag/compass/

compass实战grunt:

http://wrox.cn/article/2000491/

http://ju.outofmemory.cn/entry/73492

http://ju.outofmemory.cn/entry/75413

compass-demo/Gruntfile.js: https://github.com/minghe/compass-demo/blob/master/Gruntfile.js#L38

module.exports = function (grunt) {

    grunt.initConfig({
// 指定打包目录
buildBase: 'build',
//源码目录
srcBase: 'src', clean: {
build: [
'<%=buildBase %>'
]
},
copy: {
all: {
files: [
{
expand: true,
cwd: '<%= srcBase %>',
src: ['**/*.css'],
dest: '<%=buildBase %>'
}
]
} },
compass: {
dist: {
options: {
sassDir: '<%= srcBase %>',
specify: '<%= srcBase %>/index.sass',
cssDir : '<%= srcBase %>',
assetCacheBuster: false
}
},
sprite: {
options: {
sassDir: '<%= srcBase %>',
specify: '<%= srcBase %>/sprite.sass',
cssDir : '<%= srcBase %>',
imagesDir: "<%= srcBase %>/images",
httpPath:"http://www.36ria.com/css",
assetCacheBuster: false
}
},
spriteX2: {
options: {
sassDir: '<%= srcBase %>',
specify: '<%= srcBase %>/sprite-x2.sass',
cssDir : '<%= srcBase %>',
imagesDir: "<%= srcBase %>/images",
assetCacheBuster: false
}
}
},
cssmin: {
build: {
expand: true,
cwd: '<%=buildBase %>',
src: ['**/*.css', '!**/*-min.css'],
dest: '<%=buildBase %>',
ext: '-min.css'
}
},
watch: {
options: {
livereload: true
},
compass: {
files: ['<%= srcBase %>/**/*.sass'],
tasks: ['compass']
}
}
});
/**
* 载入使用到的通过NPM安装的模块
*/
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-compass'); grunt.registerTask('default', ['clean','compass','copy:all','cssmin:build']);
grunt.registerTask('dev', ['watch']);
grunt.registerTask('sprite', ['compass:spriteX2']); };

  

grunt + compass的更多相关文章

  1. grunt + compass retina sprites

    https://github.com/AdamBrodzinski/Retina-Sprites-for-Compass

  2. [工具]前端自动化工具grunt+bower+yoman

    安装过程 安装nodejs 安装grunt,bower,yoeman 命令:(-g 表示全局安装,否则安装到当前目录下) npm install -g grunt-cli npm install -g ...

  3. eclipse tomcat maven

    jdk jre eclipse 略过 下载maven和tomcat 上apache官网下载maven:http://maven.apache.org/download.cgi. 上apache官网下载 ...

  4. Sass和compass 安装 和配合grunt实时显示 [Sass和compass学习笔记]

    demo 下载http://vdisk.weibo.com/s/DOlfkrAWjkF/1401192855 为什么要学习Sass和compass ?提高站独立和代码产品化的绝密武器,尤其是程序化cs ...

  5. sass&compass&grunt

    1. compass compile path/to/project//编译scss compass watch path/to/project//自动监视文件变化 2.mixin @include ...

  6. (绝对官方好用,快速上手)针对grunt之前写的那篇有些乱,这次总结个清晰的

    安装 Grunt基于Node.js,安装之前要先安装Node.js,然后运行下面的命令. sudo npm install grunt-cli -g grunt-cli表示安装的是grunt的命令行界 ...

  7. grunt 入门学习

    前端工作流,Grunt上手指南 Posted@2013-04-20 7:15 a.m. CategoriesGrunt ,  javascript 我想先花点时间回忆一下作为一个前端需要做的工作(Lo ...

  8. 如何使用grunt工具

    本文来源于同事的笔记,也是在网上查找的资料,记录分析的特别详细,对初学者来说简直不能再通俗易懂了,感谢原作者! 1.前言 选择Grunt原因 管理我们的文件依赖 随心所欲的批处理任务 整合常用的前端工 ...

  9. 【转载】Grunt常用插件介绍

    项目名称 grunt-contrib v0.8.0 项目地址 https://github.com/gruntjs/grunt-contrib 项目介绍 此项目是对grunt常用插件的集合,刚接触gr ...

随机推荐

  1. java 不可变类型

    1. java不可变性初探 我们先看下面一个例子:代码如下: import java.math.BigInteger; public class BigProblem { public static ...

  2. Cocos2D 指定文件夹创建项目

    参考http://www.cnblogs.com/skynet/p/3428369.html 通过下面的一些改造,可以让新建的cocos2d-x项目独立于cocos2d-x引擎目录: 1)     将 ...

  3. <顶>vim快捷键映射Map使用

    问题描述: 使用vim中的快捷键映射map,可以自定义快捷键 问题解决: (1)vim模式 (2)map前缀 (3)删除映射Map (4)使用示例 (5)查看快捷键映射 命令行---:verbose ...

  4. IE6兼容inline-block的方法

    或许有朋友会对IE不支持 display:inline-block 属性,表示疑问或者反对.说:“我在 IE 中对 a 或者 span 等内联元素使用 display:inline-block 一直是 ...

  5. LAMP安装配置过程

    Mysql ./configure --prefix=/usr/local/mysql (注意/configure前有“.”,是用来检测你的安装平台的目标特征的,prefix是安装路径) #make ...

  6. 【POJ】【2096】Collecting Bugs

    概率DP/数学期望 kuangbin总结中的第二题 大概题意:有n个子系统,s种bug,每次找出一个bug,这个bug属于第 i 个子系统的概率为1/n,是第 j 种bug的概率是1/s,问在每个子系 ...

  7. 【WCF--初入江湖】01 WCF编程概述

    01 WCF编程概述 SOA的优点 1.服务独立于平台和工作环境.服务并不关心自己所处的环境,也不关心与之进行通信的服务所处的    环境. 2.服务相互隔离. 3.服务对协议.格式和传输中立. 4. ...

  8. Mac OS X中MacPorts的安装使用备忘

    Mac下面除了用dmg.pkg来安装软件外,比较方便的还有用MacPorts来帮助你安装其他应用程序,跟BSD中的ports道理一样.MacPorts就像apt-get.yum一样,可以快速安装些软件 ...

  9. Proxmox虚拟机增加硬盘容量

    1.首先在虚拟机控制台选择调整硬盘容量,弹出窗口为增加的容量 2.重启虚拟机,用fdisk –l查看新增容量是否被识别 3.用cfdisk创建分区,分区格式为Primary 8e (Linux LVM ...

  10. C# 委托的”四步走“

    看了一本<深入了解C#>感觉很不错,对于委托的讲解,给大家摘录了下来! 1.什么是委托 我的拙见:委托就是将方法作为参数,进行传递的 书中的记载:将某种行为“包含”在一个对象中,这个对象可 ...