gulp-sass源图无法在chrome dev控制台

Question

我很难尝试使用sass源地图来编辑sass中的chrome developer console来源。要使用gulp-sass 2.0.4和gulp-sourcemaps 1.5.2编译sass。 这是一个代码段：

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

在chrome dev控制台中，我将.css文件映射到网络资源，.map与.css一起存储，但我只能看到这个.css文件显示在元素检查上。此外，还会在chrome设置中检查源文件的使用情况 有什么想法吗？