如何使用 Gulp 更改 SASS 路径变量？答案

【问题标题】：How to change SASS path variable using Gulp?如何使用 Gulp 更改 SASS 路径变量？
【发布时间】：2014-12-29 09:42:37
【问题描述】：

我目前在 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 文件中的字体路径不正确。我该如何解决这个问题？

【问题讨论】：

标签： gulp bower gulp-sass

【解决方案1】：

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

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

【讨论】：