Есть ли способ использовать gulp-typescript для создания файлов карты и декларации во время одной задачи компиляции?

Question

Я использую gulp-typescript, чтобы перевести мой код TypeScript на JavaScript. По сути, я хочу за один файл *.ts, так как там будут соответствующие *.js, *.d.ts и *.map файлов.

В компиляционной задаче я заметил, что я могу только перевести с декларацией или переводить с картой, но не в то же время. Например, выполнение одной задачи компиляции, которая пытается сгенерировать как файлы декларации + карты (с файлами JavaScript), так и следующие, не работает. Следующие файлы будут генерироваться с помощью файлов JavaScript +, но не файлов декларации.

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

gulp.task('compile', function() { 
    var tsProject = tsc.createProject('tsconfig.json'); 
    var tsResult = gulp.src(['src/**/*.ts']) 
    .pipe(sourcemaps.init()) 
    .pipe(tsProject()); 
    return tsResult.js 
    .pipe(sourcemaps.write('.')) 
    .pipe(gulp.dest('./dist/src')); 
}); 

My tsconfig.json выглядит следующим образом.

{ 
    "include": [ 
     "src/**/*" 
    ], 
    "exclude": [ 
     "node_modules", 
     "**/*.spec.ts" 
    ], 
    "compilerOptions": { 
     "noImplicitAny": true, 
     "target": "es6", 
     "module": "commonjs", 
     "alwaysStrict": true, 
     "diagnostics": false, 
     "listEmittedFiles": false, 
     "listFiles": false, 
     "pretty": true, 
     "declaration": true 
    } 
} 

Чтобы обойти эту проблему, потому что теперь, я должен создать 3 Глоток задачи:

• один, чтобы создать заявления,
• один, чтобы создать отображение, и
• один для вызова предыдущих двух.

Эта опция работает, но не является желательной или лучшей практикой, так как теперь я должен скомпилировать два раза, чтобы получить желаемые выходы.

Мои задачи с 3 глотками выглядят следующим образом. Обратите внимание, как я сделал tsProject локальным для функций теперь (сохраняя глобальность, задача gulp не работает).

gulp.task('compile:with:dts', function() { 
    var tsProject = tsc.createProject('tsconfig.json'); 
    return gulp.src(['src/**/*.ts']) 
    .pipe(tsProject()) 
    .pipe(gulp.dest('./dist/src')); 
}); 

gulp.task('compile:with:maps', function() { 
    var tsProject = tsc.createProject('tsconfig.json'); 
    var tsResult = gulp.src(['src/**/*.ts']) 
    .pipe(sourcemaps.init()) 
    .pipe(tsProject()); 
    return tsResult.js 
    .pipe(sourcemaps.write('.')) 
    .pipe(gulp.dest('./dist/src')); 
}); 

gulp.task('compile', ['compile:with:dts', 'compile:with:maps']); 

Answer 1

У вас есть два потока в вашем примере:

• tsResult который содержит типизации FILES
• tsResult.js который содержит transpiled файлы JavaScript

Все, что вам нужно сделать, это объединить их в один поток с использованием merge-stream:

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

gulp.task('compile', function() { 
    var tsProject = tsc.createProject('tsconfig.json'); 
    var tsResult = gulp.src(['src/**/*.ts']) 
    .pipe(sourcemaps.init()) 
    .pipe(tsProject()); 
    return merge(tsResult, tsResult.js) 
    .pipe(sourcemaps.write('.')) 
    .pipe(gulp.dest('./dist/src')); 
});