typescript - 将 Typescript 转译成 ES6 而不转译异步的最佳解决方案？

Question

抱歉，标题可能让您感到困惑，让我解释一下：

我们的 JS 环境有点特殊，完全支持 ES6，没有原生生成器function*和yield，所以 Typescript 代码：

async test(): Promise {
    return await Promise.resolve();
}

将被转译成 ES6：

function test() {
    return __awaiter(this, void 0, void 0, function* () { return yield Promise.resolve(); });
}

但是，讽刺的是......我们的环境不支持原生生成器......而且，我们也不能将 TS 转换为 ES5，因为 proj 引用的一些库是 ES6 模块，所以如果你将 TS 转换为 ES5，类不能被继承（ES5 使用 __extends 来做到这一点）

所以我正在寻找一种将我们的 TS 代码转换为 ES6 的解决方案，但其中的所有代码都async转换为 ES5 风格（tslib.js）

我可以接受任何解决方案，npm / node / post scripts / TS features 什么，我需要的是线索！多谢你们。

标签： typescriptasync-awaitnpm-scripts

Answer 1

感谢@ecraig12345 的提示。

实际上要实现这一点，您必须使用Babel插件再次转译从 TS 源生成的 JS。

步骤：

1、正常从你的TS项目中编译输出JS文件。

2、用于npm安装Babel及相关插件：

@babel/cli

@babel/core

@babel/runtime

@babel/plugin-transform-for-of

@babel/plugin-transform-regenerator

@babel/plugin-transform-runtime

3、编辑你的.babelrc文件并使用这个内容： { "plugins": [ "@babel/plugin-transform-for-of", "@babel/plugin-transform-regenerator", "@babel/plugin-transform-runtime" ] }

4、编辑你tasks.json的TS项目： { .... "tasks": [ { "label": "deployTs", "group": "build", "type": "shell", "command": "tsc TS_OUTPUT_JS_FOLDER/ --module commonjs --target es6" }, { "label": "deployFinal", "group": "build", "type": "shell", "command": "npx babel TS_OUTPUT_JS_FOLDER/ -d RE_TRANSPILE_OUTPUT_FOLDER/", "dependsOn": ["depolyTs"], "dependsOrder": "sequence" }, .... ] .... }

5、然后只需deployFinal通过菜单Terminal > Run Tasks执行任务，任务会先编译TS，然后运行Babel逐步转译async输出文件夹中的语法。

玩得开心。