How to configure Webpack to work with async/await in .vue files?

Question

webpack

.babelrc looks like this:

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

The rules in webpack for .js and .vue files are described as follows:

{
  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'
        }
      }
    }
  ]
}

The async/await construct is used in both .js and .vue files. But for some reason, the collector does not swear at this construction in js files, but in vue files it gives an error: Parsing error: Unexpected token function
For the test, I use the following function:

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

Who faced, tell me please how to solve the problem.

Answer 1

Salvation of a drowning man, the work of the drowning man himself :) Resolved the issue.
The error was caused by ESlint. I added the EcmaScript 8 version to .eslintrc and the async/await construct worked:

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

Answer 2

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

To be honest, I don’t remember, but it seems that it was also transpiled in vue files