我有以下 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。
在此过程中没有抛出任何错误, typescript 已完全转译,我只剩下 ES6 代码。
最佳答案
你必须告诉 Babelify 要考虑的文件扩展名,在这种情况下对于 TypeScript 是 .ts
:
// ...
.transform(babelify, {
presets: ['es2015'],
extensions: ['.js', '.ts'] // <-- I have added .js and .ts
})
// ...
关于typescript - 将 gulp 与 tsify 和 babelify 一起使用不会运行 babel,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37838549/