首页 文章

与tsify和babelify一起使用gulp并没有运行babel

提问于
浏览
3

我有以下gulp任务(包括我所要求的所有要求):

const gulp = require("gulp");
const browserify = require("browserify");
const tsify = require("tsify");
const sass = require('gulp-sass');
const fs = require('fs');
const uglify = require('gulp-uglify');
const tslint = require('gulp-tslint');
const gutil = require('gulp-util');
const babelify = require("babelify");

gulp.task('js', function () {
    return browserify({
        entries: paths.ts + 'App/start.ts',
        debug: true
    }).plugin("tsify")
        .transform(babelify.configure({
            presets: ["es2015"]
        }))
        .bundle()
        .on('error', swallowError)
        .pipe(fs.createWriteStream(jsOutput + "app.js"));
});

包含package.json中包含的所有必需模块,包括babel-preset-es2015 . 然而,babelify变换根本没有做任何事情,只要我可以将“es2015”改为任何东西,我得到完全相同的结果(es6输出) .

我已经尝试使用指定预设的.babelrc文件,以及指定babelify转换的几种不同方式,包括添加.ts文件扩展名 .

我的tsconfig.json有以下内容:

"compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
}

它将输出类型指定为ES6 .

在此过程中不会抛出任何错误,并且打字稿完全被转换,我只剩下ES6代码 .

1 回答

  • 6

    您必须告诉Babelify有关要考虑的文件扩展名,在这种情况下,TypeScript为 .ts

    // ...
    .transform(babelify, {
        presets: ['es2015'],
        extensions: ['.js', '.ts'] // <-- I have added .js and .ts
    })
    // ...
    

相关问题