使用gulp-sass在已编译的CSS中输出SCSS文件中的行号

laik7k3q 于 2022-12-16 发布在 Gulp

关注(0)|答案(2)|浏览(217)

我最近从咕噜声切换到了吞咽任务运行器。
是否可以将编译后的CSS文件中的行号作为注解输出，以指示给定规则在SASS文件中的来源？
当我使用grunt-contrib-compass模块时，默认情况下启用了此功能。
现在我使用gulp-sass来编译sass文件。

gulp

来源：https://stackoverflow.com/questions/29672246/output-the-line-number-from-the-scss-file-in-compiled-css-with-gulp-sass

2条答案

按热度按时间

0g0grzrc1#

是的，这是可能的，你需要通过它的正确选项：

.pipe(sass({
  sourceComments: 'map',
  sourceMap: 'sass',
  outputStyle: 'nested'
}))

赞(0）回复(0）举报 2022-12-16

t98cgbkg2#

您需要按如下方式初始化gulp-sourcemaps：

const sourcemaps = require('gulp-sourcemaps');

function buildStyles() {
  return gulp.src('./sass/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(sass().on('error', sass.logError))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('./css'));
}

exports.buildStyles = buildStyles;

然后你会得到很好的源scss的嵌入式引用：