gulp-sourcemaps如何从src方法中检索匹配的path

我正在使用gulp来构build项目，并使用gulp-sourcemaps来生成源图。

我有几个这样的成员：

public |-- src |-- comp1 | |-- c1-a.js | |-- c1-b.js | |-- comp2 |-- c2-a.js |-- c2-b.js 

我想build立他们到以下结构：

 public |-- dist | |-- comp1 | | |-- c1-a.min.js | | |-- c1-a.min.js.map | | |-- c1-b.min.js | | |-- c1-b.min.js.map | | | |-- comp2 | |-- c2-a.min.js | |-- c2-a.min.js.map | |-- c2-b.min.js | |-- c2-a.min.js.map | |-- src/ 

目前我的吞咽任务可以生成正确的path文件：

 gulp.task('component', function() { gulp.src('./public/src/**/*.js', {base: './public/src'}) .pipe(sourcemaps.init()) .pipe(uglify()) .pipe(rename({suffix: '.min'})) .pipe(sourcemaps.write('.', { includeContent: false, sourceRoot: '/src/' // here's the problem })) .pipe(gulp.dest('./public/dist')) }) 

但是有两个问题：

1. 映射文件中的sourceRoot不正确：期望"sourceRoot":"/src/comp1/"但结果为"sourceRoot":"/src/"

2. sourceMappingURL在压缩文件中也没有：期望sourceMappingURL=c1-a.min.js.map但结果是sourceMappingURL=../../comp1/c1-a.min.js.map

如何将**部分附加到sourceRoot并修复sourceMappingURL？

Answer 1

你的sourceRoot被设置为/src/因为这就是你在这里所说的：

 gulp.src('./public/src/**/*.js', {base: './public/src'}) 

你已经设置了{base: './public/src'}所以下面的所有东西都会把相对于srcpath对待，所以这是正确的sourceRoot 。 但是在映射的顶部，它应该有相对于"sources":[...]中的path的部分（例如"sources":["comp1/c1-a.min.js.map"] ）。

不过，如果你真的想改变sourceRoot，你可以使用sourceRoot选项来gulp-sourcemaps ，但是你的sources是错误的。 然而，gulp-sourcemaps版本2.0.0-alpha（你必须在你的package.json预先mapSources因为它是预发行的）也有一个mapSources选项来让你修改它们。

同样，您可以使用sourceMappingURLPrefix或sourceMappingURL来更改sourceMappingURL。 在后一种情况下，您将获得完整的file对象，因此您可以检查例如cwd ， base等。在debuggingnpm / gulp任务时， console.debug或Visual Studio Code可以是一个很大的帮助 ！ 该文章展示了如何设置断点，检查variables等，我发现非常有用。