Javascript 使用webpack解析异步函数时出现的问题

我试图让webpack解析一个使用新的async/await语法的javascript文件，但它总是给我一个解析错误

这是我的webpack.config.js文件：

module.exports = {
  entry: {
    foo: './foo.js'
  },
  output: {
    filename: 'webpack-compiled.js'
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/
      }
    ]
  }
}

My package.json文件：

{
  "name": "async-func-test",
  "version": "1.0.0",
  "description": "",
  "main": "foo.js",
  "scripts": {
    "buildWithBabel": "babel foo.js --out-file babel-compiled.js",
    "buildWithWebpack": "webpack --progress --colors"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.18.0",
    "babel-core": "^6.18.2",
    "babel-loader": "^6.2.8",
    "babel-plugin-syntax-async-functions": "^6.13.0",
    "webpack": "^1.13.3"
  }
}

My babel.rc文件：

{
  "plugins": [
    "syntax-async-functions"
  ]
}

以及foo.js文件：

async function asyncFunc() {
  return 123
}

asyncFunc().then(x => console.log(x))

如果我运行npm脚本“buildWithBabel”，它运行正常，没有错误，并使用正确的输出创建babel-compiled.js

但是，如果我运行npm脚本“buildWithWebpack”，我会收到以下错误消息：

我不需要转换异步函数，只需解析它。我不知道为什么它不能像使用.babelrc中的“syntax async functions”插件那样为webpack工作，对吗？

您也需要使用，

syntax async functions

只允许Babel解析输入（然后不使用它）。Webpack还不理解ES8语法，这就是为什么它在没有传输它们的情况下失败的原因

ERROR in ./foo.js
Module parse failed: C:\Users\Redark\Desktop\asyncFuncTest\node_modules\babel-loader\lib\index.js!C:\Users\Redark\Desktop\asyncFuncTest\foo.js Unexpected token (1:6)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (1:6)