带有凉亭资源的 Firefox“无法加载样式文档”

Question

我正在使用 Firefox（最新版本 41.0.1）开发前端应用程序，但之前也遇到过这个问题。

我正在使用 Gulp-Sass、Sourcemap-Support 和其他工具处理 *.sass 文件。

这里是样式任务：

var paths = {
  folders : {
    css:        'public/assets/css',
    sass:       'public/src/sass'
  },
  files : {
    css:        'public/assets/css/**/*.css',
    sass:       'public/src/sass/**/*.sass'
  }
};

gulp.task('styles', function () {

if(compileOnly != false) {
  var srcFile = compileOnly;
} else {
  var srcFile = paths.files.sass;
}

var processors = [
  autoprefixer({
    browsers: ["last 2 versions", "> 1%", "ie 8"],
    map: true
  }),
  nano({
    safe: true // Disables Z-Index remanufacturing
  }),
  pxtorem({
    replace: false,
    prop_white_list: ['padding', 'margin', 'width', 'height', 'min-width', 'min-height', 'max-width', 'max-height', 'font', 'font-size', 'line-height', 'letter-spacing', 'top', 'left', 'bottom', 'right'],
    selector_black_list: ['body', 'html']
  }),
  postcssrgba({
    properties: [ "background-color", "background", "color", "border", "border-color", "outline", "outline-color", "box-shadow", "text-shadow" ]
  })
]

return gulp.src([srcFile],{base: paths.folders.sass})
  .pipe( plumber( { errorHandler: onError } ) )
  .pipe(sourcemaps.init())
  .pipe(sass({sourcemap: true, style: 'compact'}))
  .pipe(postcss(processors))
  .pipe(sourcemaps.write('.'))             // Source Map Generation
  .pipe(gulp.dest(paths.folders.css))                  // Output
  .pipe(notify({ message: 'Styles task complete' }));
});

一切正常，源图正在生成，firefox 开发者工具显示正确的源：http://jmp.sh/NfErzKf

但是当我点击这些资源之一时，我只会得到这个错误：

“无法加载样式文档。http://****/assets/bower/uikit/scss/core/nav.scss”（免费翻译，因为我的系统语言是德语）

文件就在那里，没有任何限制。

当我使用没有依赖项和包含的新 sass 文件进行测试时，一切正常。 Chrome 完全没有问题。 只有 Firefox，当我包含 bower 依赖项时。 会不会是 Sass 和 Scss 文件的混合？

问候

Answer 1

经过大量研究和反复试验，我可以稍微追踪一下。

首先，只有当包含来自 bower（或者可能是该级别的任何其他文件夹）的包含时，才会发生错误。如果我从那里注释掉所有@imports，一切都很好。

解决方案： 由于 Firefox 在 sourcemaps 中对 sourceRoot 的支持有点问题（same issue in browserify），我建议删除它，因为 gulp-sourcemaps 默认添加它。

您可以通过将 null 传递给此选项来在源映射中删除它：

.pipe(plugins.sourcemaps.write('.', {
    sourceRoot: null
}))