3

私はgulp-typescriptandgulp-sourcemapsを使用して TypeScript をソースマップでコンパイルしています。.jsソース マップ ファイルとソース マップ ファイルの両方を、元のファイルと同じディレクトリに出力したいと考えてい.tsます。

ファイルを使用してtsconfig.jsonTypeScript を構成し、typingsTypeScript 定義ファイルを管理するために使用しています。私自身のコードはすべて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.jsongulp.srcbase

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 に答える