想要使用 Gulp 去把 Sass 编译成 CSS ，我们可以使用 gulp sass 这个插件。先在我们的项目里去安装一下这个插件，打开命令行工具，进入到项目所在的目录。然后输入 npm install gulp-sass ... 可以把这个 gulp-sass 放到项目的开发依赖里面，加上一个 --save-dev ..

sudo npm install gulp-sass --save-dev

完成以后，回到项目 ... 在 node_modules 这里，你会看到刚才安装的 gulp-sass 插件 ... 另外，在项目的 package.json 这个文件里面， devDependencies 这里，也会有这个 gulp-sass ...

在我的项目里面，stylesheets 这个目录的下面，有一个 sass 文件，就是这个 style.scss ... 下面，我们可以使用 gulp-sass 这个插件，把这个目录里面的 sass 文件编译成 css ，再放到 dist 目录下面的 css 这个目录的下面。

打开 gulpfile.js ... 在这个文件里面，我们首先要把 gulp-sass 这个插件包含进来 ... var sass 等于 ... require ... 再指定一下这个插件的名字 ... gulp-sass .. 这样我们就可以使用 sass 这个方法去处理文件了 ...

在下面，再去创建一个任务 ... gulp.task ... 这个任务可以叫它 sass ... 再用一个匿名函数 ... return gulp.src ... 先去指定要处理的文件 ... 这里就是 stylesheets 这个目录里面的所有的 scss 格式的文件 ... 注意这里我用了一个 **/ 它会包含目录下面的所有级别的子目录 ..

接着用一个 pipe .. 在这个管道里，我们可以使用 sass 插件去处理读取进来的文件 ... 这里输入 sass() ... 这个名字是我们在上面包含 gulp-sass 这个插件的时候起的 ... 如果你用的是其它的名字，在这里，你也需要修改成对应的名字 ..

再用一个 pipe ，我们去输出处理好的文件 ... 也就是编译好的 sass ... 这里使用 gulp 的 dest 方法 ... 在这个方法里指定一下存储这些处理好的文件的路径 ... 放到 dist 目录下面的 css 这个目录里面。

保存 ... 打开命令行工具 ... 去执行一下这个任务 ... 输入 gulp sass ... 回车 ... 完成以后再回到项目 .. 打开 dist 下面的 css 这个目录 ... 在这里，你会看到编译好的 sass ... 就是这个 style.css ...