活字体+がぶ飲み+ Sourcemaps間違ったソース・パス

Question

私は、次のフォルダ構造を持つnodejsアプリを持っている：

project 
|-- src/ 
| |-- controllers/ 
| | |`-- authorize-controller.ts 
| |`-- index.ts 
|--dist/ 
| |--controllers/ 
| | |`-- authorize-controller.js 
| | |`-- authorize-controller.js.map 
| |`-- index.js 
| |`-- index.js.map 
`-- gulpfile.js 
`-- tsconfig.json 

sourcemapsが生成されます。 index.js.mapは "../src/index.ts"を指しています（正しい）。マップファイルの対応する内容は{"version":3,"sources":["../src/index.ts"],"names":[],"mappings"

ですが、dist \ controllers \ authorize-controller.js.mapは間違ったディレクトリを指しています。それは{"version":3,"sources":["../src/controllers/authentication.controller.ts"],"names":[],です。 ../がありません。

マイgulpfile.jsは次のとおりです。

gulp.task('compile',() => { 
    var tsResult = tsProject.src() 
    .pipe(sourcemaps.init()) 
    .pipe(tsProject()); 

    return tsResult.js 
    .pipe(sourcemaps.write('.', { includeContent: false, sourceRoot: '/src' })) 
    .pipe(gulp.dest('dist')); 
}); 

私tsconfig.jsonは次のとおりです。

{ 
    "compilerOptions": { 
     "module": "commonjs", 
     "target": "es6", 
     "noImplicitAny": false, 
     "sourceMap": true, 
     "outDir": "dist" 
    }, 
    "include": [ 
     "src/**/*.ts" 
    ], 
    "exclude": [ 
     "node_modules", 
     "dist", 
     ".vscode" 
    ] 
} 

私が間違って何をしているのですか？ gulp-sourcemapsによってsourceRootが無視されたようです。

Answer 1

私は、ブレークポイントヒットを得るための解決策を見つけました。 私はソースファイルの間違った部分を見ました。 "sources":["../src/controllers/authentication.controller.ts"]は常に同じで、無視することができます。 gulpタスクをsourceRoot: '../src'に変更すると動作します。 sourcemap-fileの最後に、sourceRootが設定されています。

これは私の新しい一気タスクされています

​​

Answer 2

私のソースファイルは、プロジェクトのルートフォルダに「SRC」フォルダに配置され、対応するフォルダ構造を持つすべての出力は「DIST」あなたに似たフォルダに入ります。ここにあなたを助けることができる私の "コンパイル"タスクがあります：

var gulp = require("gulp"); 
var tsc = require("gulp-typescript"); 
var sourcemaps = require('gulp-sourcemaps'); 

     gulp.task("compile", function() { 
     var tsProject = tsc.createProject('tsconfig.json'); 
     return gulp 
     .src("src/**/*.ts") 
     .pipe(sourcemaps.init()) 
     .pipe(tsProject()) 
     .pipe(sourcemaps.write(
      ".", 
     { 
      sourceRoot: function(file) { 
      var filePathSplit = file.sourceMap.file.split("/"); 
      var backTrack = '../'.repeat(filePathSplit.length-1) || '../' ; 
      var filePath = backTrack+ "src/"; 
      return filePath; 
     }} 
     )) 
     .pipe(gulp.dest("dist")); 
    }); 

これは役に立ちます。