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. Android Studio 单刷《第一行代码》系列 01 —— 第一战 HelloWorld

    前言(Prologue) 本系列将使用 Android Studio 将<第一行代码>(书中讲解案例使用Eclipse)刷一遍,旨在为想入坑 Android 开发,并选择 Android ...

  2. Connectify是一款很实用的免费软件。能把计算机变成一个无线路由器

    Connectify是一款很实用的免费软件.能把计算机变成一个无线路由器.它能通过您计算机上的无线网卡发射一个无线AP,让有WiFi功能的设备(手机.笔记本)上网.3.0版以前仅支持32位Window ...

  3. STM32的SPI问题。

    问题描述: 之前一直使用的单片机是LPC2109,对其SPI很熟悉.基本就是原本拿来稍作修改就用.由于某种原因需要使用STM32,然后设备的驱动是之前写好的,只修改了一些硬件控制端口,由于硬件驱动使用 ...

  4. release下去除nslog宏

    #ifdef __OPTIMIZE__ #define NSLog(...) #endif 加在pch文件里面

  5. JNI中使用cl命令生成DLL文件

    问题描述:     在使用JNI调用DLL时,首先需要生成DLL文件 问题解决:     (1)现在使用VS2008的cl.exe程序,生成DLL文件 (1.1)cl.exe环境搭建 注:   cl. ...

  6. C# IL DASM 使用

    IL DASM反编译工具 使用C#的猿人或多或少都会对微软的IL反编译工具(ildasm.exe)有所认识.我最早接触到这工具是公司同事使用他反编译exe程序,进行研读和修改.感觉他还是很强大. IL ...

  7. oracle将两个结果连接后进行查询,得到两个查询的联合结果

    一.需求 用户答题,共3道,必须3题都答完才能提交. 目的:要查询用户答对了几题,答错了几题.(当然此处可以只查答对的题目数,用3减即得答错题的题目数) 二.sql select * ) rightC ...

  8. 项目中的libevent

    单线程libevent模式 项目里面是多线程版的,我先理解下单线程的. //client .调用NGP::init() bool NGP::init(NGPcontext context) { _co ...

  9. epoll 知识总结

    poll/select/epoll 对比 http://www.cnblogs.com/apprentice89/p/3234677.html    ---有待继续学习 http://blog.chi ...

  10. [nowCoder] 局部最小值位置

    定义局部最小的概念.arr长度为1时,arr[0]是局部最小.arr的长度为N(N>1)时,如果arr[0]<arr[1],那么arr[0]是局部最小:如果arr[N-1]<arr[ ...