grunt + compass
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的更多相关文章
- grunt + compass retina sprites
https://github.com/AdamBrodzinski/Retina-Sprites-for-Compass
- [工具]前端自动化工具grunt+bower+yoman
安装过程 安装nodejs 安装grunt,bower,yoeman 命令:(-g 表示全局安装,否则安装到当前目录下) npm install -g grunt-cli npm install -g ...
- eclipse tomcat maven
jdk jre eclipse 略过 下载maven和tomcat 上apache官网下载maven:http://maven.apache.org/download.cgi. 上apache官网下载 ...
- Sass和compass 安装 和配合grunt实时显示 [Sass和compass学习笔记]
demo 下载http://vdisk.weibo.com/s/DOlfkrAWjkF/1401192855 为什么要学习Sass和compass ?提高站独立和代码产品化的绝密武器,尤其是程序化cs ...
- sass&compass&grunt
1. compass compile path/to/project//编译scss compass watch path/to/project//自动监视文件变化 2.mixin @include ...
- (绝对官方好用,快速上手)针对grunt之前写的那篇有些乱,这次总结个清晰的
安装 Grunt基于Node.js,安装之前要先安装Node.js,然后运行下面的命令. sudo npm install grunt-cli -g grunt-cli表示安装的是grunt的命令行界 ...
- grunt 入门学习
前端工作流,Grunt上手指南 Posted@2013-04-20 7:15 a.m. CategoriesGrunt , javascript 我想先花点时间回忆一下作为一个前端需要做的工作(Lo ...
- 如何使用grunt工具
本文来源于同事的笔记,也是在网上查找的资料,记录分析的特别详细,对初学者来说简直不能再通俗易懂了,感谢原作者! 1.前言 选择Grunt原因 管理我们的文件依赖 随心所欲的批处理任务 整合常用的前端工 ...
- 【转载】Grunt常用插件介绍
项目名称 grunt-contrib v0.8.0 项目地址 https://github.com/gruntjs/grunt-contrib 项目介绍 此项目是对grunt常用插件的集合,刚接触gr ...
随机推荐
- 【CocoaPods】配置CocoaPods前 - 本地安装好Ruby环境
xcode (反正就是代码编辑器) Xcode就不用说了把. homebrew (反正就是软件管理器) homebrew是一个包管理器,用于在mac上安装一些os x上没有的UNiX工具(比如wget ...
- python3 学习总结与建议
最近我又玩起了python,以前听说过它,只是那时候我看见官方的一句名言:“用python语言编程,只用一种最好的方式去实现就可以了”,我就对它提不起兴趣了.原因是我是一个喜欢自由的人,不喜欢做事情只 ...
- LintCode-Unique Path II
Follow up for "Unique Paths": Now consider if some obstacles are added to the grids. How m ...
- HTML & XML 转义字符
HTML & XML 转义字符 HTML中<, >,&等有特殊含义,(前两个字符用于链接签,&用于转义),不能直接使用.使用这三个字符时,应使用它们的转义序列,如下 ...
- android开发 socket接收图片并保存
逻辑:接收到socket之后需要将socket发送的图片数据保存下来并通知handler更新界面 关键代码: public void readImage(Socket socket) { try { ...
- 生成最小树prim算法
最小生成树prim算法实现 ‘ ’最小生成树,就是权值(两点间直线的值)之和的最小值. 首先,要用二维数组记录点和权值.如上图所示无向图: int G[6][6]; G[1] ...
- The 2014 ACM-ICPC Asia Mudanjiang Regional First Round
The Himalayas http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=5341 签到 #include<cstdio& ...
- 2012 Asia Hangzhou Regional Contest
Friend Chains http://acm.hdu.edu.cn/showproblem.php?pid=4460 图的最远两点距离,任意选个点bfs,如果有不能到的点直接-1.然后对于所有距离 ...
- display:none和visibility: hidden二三事
display:none属性后,HTML元素(对象)的宽度.高度等各种属性值都将“丢失”;而使用visibility:hidden属性后,HTML元素(对象)仅仅是在视觉上看不见(完全透明),而它所占 ...
- 关于JS及应用程序开发的一些体会
代码通常从 一,生命周期 二,业务流程 这几方面来看. JS Client可以和Server端分离. JS端的生命周期. Server端就是 JS能处理的只是HTTP协议.