What is the correct babel configuration to get `async/await` functions working - async-await

Question

this is what I have in my babel-options.js file. My app fails to load and without any errors in the console
I also tried updating the presets to [['latest', { loose: true, modules: modules }], 'stage-3], but gulp complained about not being able to find the relative path to latest
babel-options.js
var path = require('path');
var paths = require('./paths');
module.exports = function(modules) {
return {
filename: '',
filenameRelative: '',
sourceMap: true,
sourceRoot: '',
moduleRoot: path.resolve('src').replace(/\\/g, '/'),
moduleIds: false,
comments: false,
compact: false,
code: true,
presets: [ ['es2015', { loose: true, modules: modules }], 'stage-1'],
plugins: [
'syntax-flow',
'transform-decorators-legacy',
'transform-flow-strip-types',
'transform-async-to-generator'
]
};
};
skeleton pack I'm using: https://github.com/aurelia/skeleton-navigation/tree/master/skeleton-esnext
sample babel-options.js
https://github.com/aurelia/skeleton-navigation/blob/master/skeleton-esnext/build/babel-options.js

Answer 1

I use babel with webpack and async/await works for me. This is my webpack.config.babel.js:
var path = require( 'path' );
var webpack = require( 'webpack' );
var VersionFile = require('webpack-version-file-plugin');
var wwwPath = path.join(__dirname, 'public/dist');
module.exports = {
entry: {
preload: [ 'babel-polyfill', './src/main.js' ]
},
cache: true,
debug: true,
devtool: 'source-map',
output: {
path: path.join( __dirname, 'public/dist' ),
publicPath: '../public/dist/',
filename: '[name].js',
chunkFilename: '[id].js',
libraryTarget: 'var',
library: 'ViewerEntryPoint'
},
resolve: {
root: [
path.join( __dirname, '..', 'app', 'src' ),
],
alias: {
jquery$: 'jquery/jquery',
lodash$: 'lodash/lodash',
_$: 'lodash/lodash'
}
},
resolveLoader: {
root: [
path.join( __dirname, 'node_modules' )
]
},
module: {
loaders: [
{
loader: "babel-loader",
// Skip any files outside of your project's `src` directory
include: [
path.resolve( __dirname, "src" ),
],
// Only run `.js` and `.jsx` files through Babel
test: /\.jsx?$/,
// Options to configure babel with
query: {
plugins: [ 'transform-runtime' ],
presets: [ 'es2015', 'stage-0' ] //, 'react'],
}
},
{ test: /\.css$/, loaders: [ 'style/useable', 'css' ] },
{ test: /[\/\\]jquery\.js$/, loader: 'exports?window.$' }
],
noParse: [
/[\/\\]jquery\.js$/
]
},
plugins: [
//new Clean(['dist']),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.SourceMapDevToolPlugin( {
test: /\.js$/,
moduleFilenameTemplate: '[absolute-resource-path]',
fallbackModuleFilenameTemplate: '[absolute-resource-path]?[hash]',
filename: "[file].map",
sourceRoot: '/src/'
} ),
new VersionFile( {
packageFile: path.join( __dirname, 'package.json' ),
template: path.join( __dirname, 'version.ejs' ),
outputFile: path.join( wwwPath, 'version.json' )
} )
]
};