ბეიბელის გამოყენება TypeScript ES6-ის გადაქცევისთვის Gulp-ში


მინდა გამომეყენებინა Babel იმისათვის, რომ აღემატლებინა TypeScript-ის ES6 გამომავალი და გამოვიყენე ეს სინტაქსი:

var gulpBabel = require('gulp-babel');
var ts = require('gulp-typescript');
// ...
function compileTypescript(fileSpec, folder) {
    var options = {jsx: 'react', moduleResolution: 'node', target: 'ES6'}
    return gulp
        .src(fileSpec)
        .pipe(sourcemaps.init())
        .pipe(ts(options))
        .pipe(gulpBabel({presets: ['react', 'es2015', 'stage-0']}))
        .pipe(sourcemaps.write("."))
        .pipe(gulp.dest(folder));
}

ეს ქმნის თითქოს სწორი კოდის, მაგრამ რაღაც ცუდი ხდება იმპორტებთან, ამ ts-ფაილში იმპორტი:

 import * as express from 'express'

... ხდება:

 var _express = require('express');
 var express = _interopRequireWildcard(_express);

... რაც წარუმატებლად მუშაობს node.js-ში. ("express არ არის ფუნქცია") როდესაც პირდაპირ ვაკეთებ კომპილაციას es5-ში TypeScript-ის კომპაილერის გამოყენებით, მაქვს შემდეგი მუშაობადი გამოტანა:

var express = require('express');

რა ვაკეთებ აქ შეცდომით?

შენიშვნა: მე მსურს ES6-ის გამომუშავება, რადგან ზოგიერთი „typings“ ბიბლიოთეკა, ამ შემთხვევაში express-handlebars, ითვალისწინებს ES6-ს. მე შემიძლია ამით მუშაობა ES5 ts-გამომუშავებით, მაგრამ მაშინ typings ფაილი ხელით უნდა შეიცავდეს es6-promise სიმბოლოებს - რაც ჩემს გადამუშავების პროცესში კარგად არ იმუშავებს. არის სხვა გზები ამ პრობლემის გამოსასწორებლად?

შენიშვნა: მე ვიყენებ ერთსა და იმავე babel კონფიგურაციას ჩემს რეგულარულ ES6 ჯავასკრიპტის ფაილებთან და ეს კარგად მუშაობს.

პასუხი #1

ეს გამოწვეულია იმით, რომ TypeScript-ი ელოდება express-იდან სტანდარტული ექსპორტს, მაგრამ ის არ არსებობს.

მათ 1.8-ში დაუმატეს allowSyntheticDefaultImports სეგმენტი ამის მოსაგვარებლად. დოკუმენტაციის მიხედვით:

სურათეების სტანდარტული იმპორტების დაშვება მოდულებიდან, რომლებსაც სტანდარტული ექსპორტი არ აქვთ. ეს არ ეხება კოდის გამომუშავებას, მხოლოდ ტიპების შემოწმებას.

ცადეთ ის ერთ-ერთ თქვენს ვარიანტად გადაგზავნოთ:

var options = {jsx: 'react', moduleResolution: 'node', target: 'ES6', allowSyntheticDefaultOptions: true}

პასუხი #2

გამოდის, რომ ტიპების კომპილატორი იცვლის მოდულის წილის ნაგულისხმევ პარამეტრს, როდესაც გადადის ES6 მიზანზე. როგორც ჩანს, ეს არის მიზეზი. როდესაც module პარამეტრს ადგენენ 'CommonJS'-ზე, კოდი კარგად მუშაობს ES6 მიზანთან და Babel-ის ტრანსფორმაციებთან ერთად:

var options = {jsx: 'react', moduleResolution: 'node', target: 'ES6', 
    module: 'CommonJS'}
    ------------------

ახლა მე შემიძლია გამოვიყენო ეს ES6-ზე დამოკიდებული ტაიპინგების ფაილი 'express-handlebars'-ისთვის, d.ts ფაილის გაუმართვევლად.