Monday, June 3, 2024
 Popular · Latest · Hot · Upcoming
72
rated 0 times [  78] [ 6]  / answers: 1 / hits: 24404  / 9 Years ago, wed, february 25, 2015, 12:00:00

There is a proposal for introducing C# style async-await. I know Babel.js transpiles ES6 to ES5, but is there any way to make it transpile async-await to ES5?


More From » async-await

 Answers
103

Babel v6



As of Babel v6, Babel doesn't contain any transformers itself anymore. You have to explicitly specify any feature you want to transform.



Presets - non ES2015 environment



The quickest way to get this working is to use presets which already contain the set of plugins needed to transform ES2015 and newer proposals. For async, you will need the es2015 and es2017 presets and the runtime plugin (don't forget to install 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 all you need is the es2017 preset:



{
presets: [
es2017
]
}


Custom



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



syntax-async-functions is needed in any every case to be able to parse async functions



In order to run the async function, you either need to use




  • transform-async-to-generator: Converts the async function into a generator. This will use Babel's own co-routine implementation.

  • 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 Babel's own method. This allows you to use external libraries such as bluebird.



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



Examples:



Async to generator



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


Async to module method



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


Async to generator + regenerator



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





Babel v4 and older



Yes, you have to enable the experimental transformers. Babel uses regenerator.




Usage



$ babel --experimental





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


[#67684] Monday, February 23, 2015, 9 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
alysas

Total Points: 616
Total Questions: 111
Total Answers: 124

Location: Slovenia
Member since Wed, Apr 6, 2022
2 Years ago
;