Точка останова VSCode не работает в машинописном тексте с исходным кодом, сгенерированным gulp-sourcemaps

Question

У меня есть файл машинописного текста users.ts в подкаталоге routes.

глотком код в gulpfile.js:

var tsProject = ts.createProject(tsConfigFile); 
return tsProject.src() 
    .pipe(sourcemaps.init()) 
    .pipe(ts(tsProject)) 
    .js 
    .pipe(sourcemaps.write('.', {includeContent: false, sourceRoot: ''})) 
    .pipe(gulp.dest('.')); 

sourcemap порождена gulp-sourcemaps не работает с VSCode:

{"version":3,"sources":["routes/users.ts"],"names":[], "mappings":"...","file":"routes/users.js","sourceRoot":""} 

sourcemap порождена tsc отлично работает в VSCode:

{"version":3,"file":"users.js","sourceRoot":"","sources":["users.ts"],"names":[], "mappings":"..."} 

и точка останова VSCode wo rks fine с исходной картой, созданной tsc.

Итак, как настроить gulp-typescript/gulp-sourcemaps для создания такой же исходной карты, как tsc?

Answer 1

Это та же проблема, как и в Gulp Typescript + Browserify; Bundled sourcemap points to transpiled JS rather than source TS
Добавить функцию sourceRoot в sourcemaps.write(...)
Предполагая, что ваши .ts файлов находятся в src папки проекта, sourcemaps трубы будет выглядеть следующим образом:

.pipe(sourcemaps.write('.', { 
      sourceRoot: function(file){ return file.cwd + '/src'; } 
     })) 

Answer 2

Sourcemap путь будет правильно на машине, где вы создаете их с помощью метода v-andrew. Тем не менее, если вы хотите скомпилировать sourcemaps раз работать на нескольких машинах, использовать относительные: Пути к файлам

var path = require('path'); 

... 

.pipe(sourcemaps.write('.', { 
    includeContent: false, 
    sourceRoot: function(file) { 
    var fullPath = path.join(file.cwd, file.path); 
    return path.relative(fullPath, file.base); 
    }, 
})) 

Answer 3

Я использую Глоток-sourcemaps 2.6.1 на Windows, и @ решение Westy92 не работает (больше ?), потому что file.path возвращает абсолютный путь к файлу (включая имя файла):

var path = require('path'); 

... 

.pipe(sourcemaps.write({ 
    includeContent: false, 
    sourceRoot: function(file) { 
    return path.relative(path.dirname(file.path), file.base); 
    }, 
}))