gulp-ruby-sass
它使用Sass gem编译Sass,将结果输出到一个gulp流
安装命令npm install –save-dev gulp-ruby-sass
注意:使用gulp-ruby-sass而不是gulp.src来编译Sass文件
var gulp = require('gulp');
var sass = require('gulp-ruby-sass');
gulp.task('sass', function () {
return sass('source/file.scss')
.on('error', sass.logError)
.pipe(gulp.dest('result'));
});
gulp-sass
- 依赖于node-sass这个库,node-sass是对libsass的Node绑定
- 安装命令
npm install gulp-sass --save-dev
'use strict';
var gulp = require('gulp');
var sass = require('gulp-sass');
gulp.task('sass', function () {
return gulp.src('./sass/**/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('./css'));
});
gulp.task('sass:watch', function () {
gulp.watch('./sass/**/*.scss', ['sass']);
});
两者不同
gulp-ruby-sass是调用sass,所以需要ruby环境,需要生成临时目录和临时文件。
gulp-sass是调用node-sass,有node.js环境就够了,编译过程不需要临时目录和文件,直接通过buffer内容转换。
那到底我的项目用哪个更好呢,我最终选择了gulp-sass,原因有三:
1、看到gulp-sass 的热度远高于gulp-ruby-sass
https://www.npmjs.com/package/gulp-sass
https://www.npmjs.com/package/gulp-ruby-sass
2、gulp-ruby-sass需要另外依赖ruby环境,需要下载安装、麻烦,而gulp-sass只需node环境,正常我们用gulp已经有node环境了,省事。
3、发现一个gulp-ruby-sass路径替换的bug,详见:https://segmentfault.com/a/1190000003112509
4、gulp-ruby-sass我之前用过了,改用gulp-sass试下。