实际的使用场景：压缩css文件到指定目录，并且更改页面引用的css。
Gruntfile.js内容如下：
module.exports = function(grunt) {
require(‘load-grunt-tasks‘)(grunt);//相当于加载了package.json文件中的所有依赖项，省去了写一大堆
//grunt.loadNpmTasks(‘grunt-usemin‘)
grunt.initConfig({
usemin: {
html: [‘shop.html‘]
},
cssmin:{
target: {//target这是任务名，可以随意取，但是不要与cssmin冲突
files: [{
expand: true,//占位符（即*号）都要扩展成具体的文件
cwd: ‘./‘,//相对路径
src: [‘*.css‘],//相对路径下的要压缩的文件,可以使用通配符
dest: ‘mycssmin‘,//要压缩文件放入的目标路径
ext: ‘.min.css‘ //压缩后的文件后缀
}]
}
}
})
grunt.registerTask(‘styleMin‘,[‘cssmin‘,‘usemin‘]);
}
html内容：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>shop</title>
<!-- build:css mycssmin/style.min.css -->
<link rel="stylesheet" href="style.css">
<!-- endbuild -->
</head>
<body>
<p>该页面被监听!</p>
</body>
</html>
操作后的页面：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>shop</title>
<link rel="stylesheet" href="style.min.css">
</head>
<body>
<p>该页面被监听!</p>
</body>
</html>
页面中必须加入：
<!-- build:css mycssmin/style.min.css -->与<!-- endbuild -->
这样压缩完后再执行usemin的时候，页面的链接才会被替换掉！但是怎么感觉这样很无脑呢？-_-
绝对还有别的的方法，继续学习，再来修改这里。
Grunt使用-V2.0(压缩css文件到指定目录，并且更改页面引用的css)
原文：http://www.cnblogs.com/zqzjs/p/5331098.html