Как настроить Webpack, что бы работал async/await в .vue файлах?

Question

[Рамиль]

.babelrc выглядит так:

{
	"presets": ["env"],
	"plugins": [
		"transform-object-rest-spread",
		"transform-runtime"
	]
}

Правила в webpack для файлов с расширением .js и .vue описаны так:

{
	test: /\.js|vue$/,
	enforce: 'pre',
	exclude: /node_modules/,
	loader: 'eslint-loader',
	options: { configFile: './.eslintrc' }
},
{
	test: /\.js$/,
	exclude: /node_modules/,
	loader: 'babel-loader'
},
{
	test: /\.vue$/,
	exclude: /node_modules/,
	use: [
		{
			loader:'vue-loader',
			options: {
				loaders: {
					js: 'babel-loader'
				}
			}
		}
	]
}

Конструкция async/await используется и в .js и в .vue файлах. Но почему то на эту конструкцию в js файлах не ругается сборщик, а в vue файлах выдает ошибку: Parsing error: Unexpected token function
Для теста использую такую функцию:

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

Кто сталкивался, подскажите пожалуйста как решить проблему.

Answer 1

[Рамиль]

Спасение утопающего, дело рук самого утопающего:) Решил вопрос.
Ошибку вызывал ESlint. Добавил в .eslintrс версию EcmaScript 8 и конструкция async/await заработала:

"parserOptions": {
	"ecmaVersion": 8,
	"sourceType": "module"
}

Answer 2

[Aslan]

{
  test: /\.js$/,
  loader: 'babel-loader',
  exclude: /node_modules/,
  options: {
    presets: ['env'],
    plugins: ['transform-runtime']
  }
}

Честно говоря не помню, но вроде то что во vue файлах тоже транспилировался

Comments

[Рамиль]

Не понял Вас.

[Aslan]

options: {
presets: ['env'],
plugins: ['transform-runtime']
}

вставьте в ваш конфиг вебпака

[Рамиль]

Я уже пробовал вставлять в опции babel-loader содержимое файла .babelrc. Это не помогает. По идее babel-loader должен видеть .babelrc и брать опции из него. Для js файлов это работает.

[Рамиль]

Очень странное поведение. Плагин transform-object-rest-spread для vue файлов работает. Это говорит о том что .babelrc для vue файлов виден.