java定位的目录不对_源映射位置错误或路径不正确

我一直在努力让gulp sass和gulp sourcemaps完全按照我的意愿去做，我发现它很难 . 我想获取一个sass入口文件(src / sass / index.scss)，生成一个输出文件(dist / css / index.css)和该索引文件的单独源图(dist / css / index.css.map)其中sourceRoot设置为项目基础(绝对路径：/ home / damon / projects / test)，源映射条目相对于该路径 .

这是我试过的：

尝试1：来自gulp-sass的直接示例代码：

var sassEntry = 'src/sass/index.scss';

gulp.src(sassEntry)

.pipe(sourcemaps.init())

.pipe(sass().on('error', sass.logError))

.pipe(sourcemaps.write())

.pipe(gulp.dest('dist/css'));

结果：这将源映射内联到CSS文件中，因此无法判断它是否正确 .

尝试2：将其写入单独的文件

gulp.src(sassEntry)

.pipe(sourcemaps.init())

.pipe(sass().on('error', sass.logError))

.pipe(sourcemaps.write('.'))

.pipe(gulp.dest('dist/css'));

结果：写一个单独的源映射，但是sourceRoot说'/ sources /'(WTF是那个？！，它不存在，我从来没有配置它)，路径都是相对于sass入口文件，而不是项目库，当我的浏览器试图找到源文件时，这也将毫无意义 .

尝试3：尝试修复sourceroot(我发现includeContent：false)

gulp.src(sassEntry)

.pipe(sourcemaps.init())

.pipe(sass().on('error', sass.logError))

.pipe(sourcemaps.write('.',{includeContent: false, sourceRoot: __dirname}))

.pipe(gulp.dest('dist/css'));

结果：sourceroot现在是我的工作文件夹，很好，内容不包含哪个很好，但是源图中的文件仍然相对于sass条目文件而不是sourceRoot，所以我的 Map 仍然无用

尝试4：设置gulp.src基础

gulp.src(sassEntry, { base: __dirname })

.pipe(sourcemaps.init())

.pipe(sass().on('error', sass.logError))

.pipe(sourcemaps.write('.',{includeContent: false, sourceRoot: __dirname}))

.pipe(gulp.dest('dist/css'));

结果：令人激动的是，在gulp.src上设置基础修复了源映射 - sourceRoot仍然是正确的，源文件路径是相对于sourceRoot的，但它现在输出到dist / css / src / sass / index.css这是错误的 . WTF！

尝试5：使用绝对路径

gulp.src(sassEntry, { base: __dirname })

.pipe(sourcemaps.init())

.pipe(sass().on('error', sass.logError))

.pipe(sourcemaps.write('.',{includeContent: false, sourceRoot: __dirname}))

.pipe(gulp.dest(__dirname + '/dist/css'));

结果：没有变化，它仍然输出到dist中相同的深层结构 .

如果有人能告诉我如何做到这一点，我将永远感激 .