3

我正在使用gulp-typescriptgulp-sourcemaps使用源映射编译 TypeScript。我想.js将源映射文件和源映射文件都输出到与原始文件相同的目录.ts

我正在使用一个tsconfig.json文件来配置 TypeScript,并且我正在使用它typings来管理 TypeScript 定义文件。我自己的所有代码都在js目录中。这是我的项目结构:

project root
|-- js/
|   |-- subdir/
|   |   |-- someScript.ts
|   |-- app.ts
|-- typings/
|   |-- someDefinitionFile.d.ts
|-- gulpfile.js
|-- tsconfig.json

现在我想出现在目录中,并出现app.js在. 另外,在 Chrome 中调试时,我想在“源”选项卡中保持相同的文件夹结构。jssomeScript.jsjs/subdir

我为此配置了以下 gulp 任务:

var gulp = require("gulp");
var ts = require("gulp-typescript");
var tsProject = ts.createProject("tsconfig.json");
var sourcemaps = require('gulp-sourcemaps');

gulp.task("ts", function () {
    var tsResult = tsProject
      .src()
      .pipe(sourcemaps.init())
      .pipe(ts(tsProject)).js
      .pipe(sourcemaps.write("."))
      .pipe(gulp.dest("js"));
});

这有效地输出.js了正确目录中的文件。但是,在 Chrome 中运行它并打开开发工具时,这些.ts文件位于根目录下的“源”目录中,这意味着源映射文件包含不正确的根目录。

应该更改什么以显示同一位置的.ts文件和文件?.js

注意:这个问题类似于这个问题除了我想使用tsconfig.json,因此不能使用gulp.src或其base属性。

4

1 回答 1

4

只需设置sourceRootgulp-sourcemap 写入选项的属性。此任务有效:

gulp.task("ts", function () {
    tsProject.src()
        .pipe(sourcemaps.init())
        .pipe(ts(tsProject)).js
        .pipe(sourcemaps.write({sourceRoot: "/js"}))
        .pipe(gulp.dest("js"));
});
于 2016-05-13T07:28:51.223 回答