The following works perfectly:
export default function x () {
return 'hello world'
}
export function y () {
return x()
}
console.log(y())
However this does not work:
export default async function x () {
return 'hello world'
}
export function y () {
return x()
.then(console.log)
}
y()
When the default
function is async
for some reason x is not defined
.
Can we export async function? This is not possible. Since the value is retrieved asynchronously, all modules that consume the value must wait for the asynchronous action to complete first – this will require exporting a Promise that resolves to the value you want.
An async function is a function declared with the async keyword, and the await keyword is permitted within it. The async and await keywords enable asynchronous, promise-based behavior to be written in a cleaner style, avoiding the need to explicitly configure promise chains.
The export statement is used when creating JavaScript modules to export objects, functions, variables from the module so they can be used by other programs with the help of the import statements.
Exports without a default tag are Named exports. Exports with the default tag are Default exports. Using one over the other can have effects on your code readability, file structure, and component organization. Named and Default exports are not React-centric ideas.
Looks like this is a known issue inside babel project: https://github.com/babel/babel/issues/3786
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With