如何使用Gulp更改SASS路径变量?

时间:2014-12-29 09:42:37

标签: gulp bower gulp-sass

我目前正在Laravel项目中使用Bower和Gulp来管理前端依赖项。我正在使用Bower下载私有资产文件夹中的所有bower依赖项,然后使用Gulp将它们推送到公共文件夹。

这是我的gulpfile.js

var gulp        = require('gulp');
var flatten     = require('gulp-flatten');
var sass        = require('gulp-ruby-sass');

gulp.task('fonts', function () {
  return gulp.src('app/assets/vendor/**/*.{ttf,woff,eof,svg}')
    .pipe(flatten())
    .pipe(gulp.dest('.tmp/fonts'))
    .pipe(gulp.dest('public/fonts'));
});

gulp.task('css', function () {
    return gulp.src('assets/vendor/open-sans-fontface/open-sans.scss')
        .pipe(sass({sourcemap: true, sourcemapPath: '../scss'}))
        .on('error', function (err) { console.log(err.message); })
        .pipe(gulp.dest('public/css'));
});

gulp.task('default', function(){
    gulp.run('fonts');
    gulp.run('css');
});

正如您所看到的,我正在使用gulp-flatten将所有字体文件移动到 / public / fonts 的根目录 现在,我面临的问题是使用gulp-ruby-sass生成的CSS文件中的字体路径不正确。我该如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

如果没有替代内置选项和sass文件附带的Gulp文件,您可以尝试使用Gulp替换包。

https://www.npmjs.com/package/gulp-replace