内联源图（使用gulp-sourcemaps生成）无法正常工作

Question

这有点奇怪：

我有一个看起来像这样的gulp任务：

gulp.task('less', function () {
  gulp.src('./less/main.less')
    .pipe(sourcemaps.init())
    .pipe(less({
      plugins: [cleancss]
    }))
    .pipe(sourcemaps.write()) // will write the source maps to ./public/assets/css-dist/maps
    .pipe(gulp.dest(paths.public + 'css/dist'));
});

我在play 1.3项目中运行此任务，并按预期生成base64编码的内联源图，但是当我在chrome中加载它时，所有样式都映射到第1行main.css，表明出现了问题。

现在，在这里它变得奇怪：如果我运行同样的任务，指向相同文件的副本，在具有相同目录结构的另一个项目中，只需在普通的＆＃39; apache，它完全按预期工作。输出文件看起来完全一样。

有没有人知道为什么会这样？

FWIW，使用gulp-uglify和gulp-concat

缩小和连接我的js时，会出现一个非常类似的场景

Answer 1

尝试查看是否可以通过this visualizer tool可视化差异/映射。如果两个项目之间的两个编译文件完全相同，那么可能是由于您提供/访问文件的方式不同？在第二个项目中，您是否也尝试通过Chrome查看源图？

为了澄清一下，您不仅要编写内联源图，还要嵌入源代码，以便所有内容都在已编译的.css文件中，外部原始源文件不是引用源（sourceRoot将是 / source / ）。