使用Bable將Typescript項目配置為從ES6轉換為ES5

Question

我剛剛開始一個新項目，我真的想使用最近為typescript發布的Async和Await東西。

但是，如果你的目標是ES6，它只會起作用（現在）。

所以我想知道是否有辦法配置Visual Studio（2015 Update 1）來獲取由Typescript輸出的ES6 java腳本並將其轉換為es5？

所以，我會有Typescript - > ES6 - > ES5。 （這將在Typescript支持Async / Await目標ES5之前實現。）

Answer 1

可能是，這不完全是你問的問題，但它是一種做同樣事情的方法。 我希望，它可能是有用的。 首先，如http://docs.asp.net/en/latest/client-side/using-gulp.html所述 ，您可以在VS2015中使用gulp。 然后，在tsconfig.json文件中，您應該將typescript編譯器選項設置為如下所示：

//tsconfig.json

{
    "compilerOptions": {
        "target": "ES6",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "module": "commonjs",
        "noImplicitAny": false,
        "removeComments": true,
        "preserveConstEnums": true
    },
    "exclude": [
        ".vscode",
        "node_modules",
        "typings",
        "public"
    ]
}

最后，gulp文件 - 例如我的一個項目 - 用於轉換ES6到ES5：

// gulpfile.js

'use strict';

var gulp = require("gulp"),
    ts = require("gulp-typescript"),
    babel = require("gulp-babel");

var tsSrc = [
    '**/*.ts',
    '!./node_modules/**',
    '!./typings/**',
    '!./vscode/**',
    '!./public/**'
];
gulp.task("ts-babel", function () {
    var tsProject = ts.createProject('tsconfig.json');
    return gulp.src(tsSrc)
        .pipe(tsProject())
        .pipe(babel({
            presets: ['es2015'],
            plugins: [
                'transform-runtime'
            ]
        }))
        .pipe(gulp.dest((function (f) { return f.base; })));
});

現在，您可以使用命令gulp ts-babel來轉換文件。 並且不要忘記安裝所需的npm-packages，如babel-preset-es2015和babel-plugin-transform-runtime。

更新 。 感謝Ashok MA的關注。 將管道（ts（））更改為管道（tsProject（））