Transpile Async Waiting for an offer with Babel.js?

Question

There is a suggestion for introducing a C # async-await style. I know Babel.js is converting ES6 to ES5, but is there any way to make it redirect async-wait to ES5 ?

Answer 1

Babel v6

As for Babel v6, Babel no longer contains transformers. You must explicitly specify any function that you want to convert.

Presets - Environment without ES2015

The fastest way to get this working is to use presets that already contain the set of plugins needed to convert ES2015 and new offers. For async you will need the preliminary es2015 and es2017 and the runtime plugin (do not forget to set the babel-runtime as described in the documentation):

 { "presets": [ "es2015", "es2017" ], "plugins": [ "transform-runtime" ] } 

Presets - ES2015 Environment

If you run the code in an environment that supports ES2015 (more specifically, generators and promises), then you only need to install es2017:

 { "presets": [ "es2017" ] } 

custom

To convert only async functions, you will need the following plugins.

syntax-async-functions necessary in any case for the possibility of parsing asynchronous functions

To run the async function, you need to either use

• transform-async-to-generator : Converts an async function to a generator. This will use the “collaborative” implementation of Babel.
• transform-async-to-module-method : also converts the async function to a generator, but passes it to the module and method specified in the configuration instead of the Babel native method. This allows the use of external libraries such as bluebird .

If your code runs in an environment that supports generators, then nothing remains. However, if the target environment does not support generators, you will also have to convert the generator. This is done using transform-regenerator . This conversion depends on the runtime functions, so you will also need transform-runtime Babel (+ babel-runtime package).

Examples:

Asynchronous generator

 { "plugins": [ "syntax-async-functions", "transform-async-to-generator" ] } 

Asynchronous method

 { "plugins": [ "syntax-async-functions", ["transform-async-to-module-method", { "module": "bluebird", "method": "coroutine" }] ] } 

Asynchronous generator + regenerator

 { "plugins": [ "syntax-async-functions", "transform-async-to-generator", "transform-regenerator", "transform-runtime" ] } 

---

Babel v4 and older

Yes, you must turn on experimental transformers . Babylon uses a regenerator .

Application

 $ babel --experimental 

---

 babel.transform("code", { experimental: true }); 

Answer 2

This decision may have changed since then (February 25th Felix Kling), or perhaps there is another way to use async.

What worked for us is to run Babel like this

 $ npm install babel-runtime 

---

 $ babel inputES7.js -o outputES5.js --optional runtime 

Answer 3

I got this work today by doing the extra npm install babel-preset-stage-0 and using it as

 var babel = require("babel-core"); var transpiled = babel.transform(code, { "presets": ["stage-0"] }); 

Cm

• http://babeljs.io/docs/usage/options/#options
• http://babeljs.io/docs/plugins/preset-stage-0/

Answer 4

Perhaps even more modern; just put the babel stuff in a separate file:

 'use strict'; require('babel/register'); // Imports babel - auto transpiles the other stuff require('./app'); // this is es6 - gets transpiled 

See my how-can-i-use-es2016-es7-async-await-in-my-acceptance-tests-for-a-koa-js-app code for details.

Answer 5

The approved answer seems outdated. The experimental flag is deprecated in favor of the stage.

http://babeljs.io/blog/2015/03/31/5.0.0/#experimental-option

Using

 $ babel --stage 0 

---

 babel.transform("code", { stage: 0 }); 

Stage 0

• es7.classProperties
• es7.comprehensions

Stage 1

• es7.asyncFunctions
• es7.decorators
• es7.exportExtensions
• es7.objectRestSpread

Stage 2 (stage 2 and above are enabled by default)

• es7.exponentiationOperator