async / await 破坏了我为 AWS Lambda 构建的 Webpack；如何迁移到 Node 8.10？

Question

注意：这是一个关于将 AWS Lambda Webpack 构建从 v6.10 迁移到 v8.10 的问答 - 不需要帮助，但当然总是鼓励更好的答案！

---

在阅读了 James Long 的优秀系列“Webpack 的后端应用”（part 1, part2和part3)。

直到最近，Amazon Web Services 提供的唯一 Node.js 版本是 6.10；您必须以“回调”样式编写 Lambda fn。但是在 2018 年 4 月 2 日AWS announced that 8.10 was now supported，建议的模式是异步/等待，这很棒！直到它立即破坏了我的 Webpack 构建。经过一些调试，我可以通过向 Lambda 处理程序添加一个异步 fn 来破坏我的构建（我什至不需要调用它）：

async function firstAsync() {
  return true;
}

exports.handler = async (event) => {
    // TODO implement
    return 'Hello from Lambda!'
};

需要明确的是，在 AWS Lambda 控制台中执行此操作非常好，运行良好。 Webpack 甚至成功构建它，但在上传到 AWS Lambda 后，我收到以下错误消息：regeneratorRuntime is not defined。我的代码如下。我需要做什么？

webpack.config.js

const nodeExternals = require('webpack-node-externals');
const path = require('path');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const webpack = require('webpack');

const config = {
  entry: './src/index.js',

  output: {
    path: path.resolve(__dirname, 'dist'),
    library: 'index',
    libraryTarget: 'commonjs2',
    filename: 'index.js'
  },
  target: 'node', // building for a Node environment
  externals: [nodeExternals()], // in order to ignore all modules in node_modules folder 
  module: {
    rules: [{
      test: /\.(js|jsx)$/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['env']
        }
      }
    }]
  },
  plugins: [
    new UglifyJsPlugin()
  ]
};

module.exports = config;

package.json

{
  "name": "lambda-webpack",
  "version": "1.0.0",
  "description": "An empty project scaffold to enable webpack builds in AWS Lambda",
  "main": "index.js",
  "scripts": {
    "build": "webpack",
    "upload": "upload.bat"
  },
  "author": "Geek Stocks®",
  "license": "MIT",
  "devDependencies": {
    "aws-sdk": "^2.179.0",
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.1",
    "uglifyjs-webpack-plugin": "^1.1.6",
    "webpack": "^3.10.0",
    "webpack-node-externals": "^1.6.0"
  }
}

Answer 1

Geek Stock 的answer above 仅在使用 Node v6.10 运行时时才需要。它允许您使用 async/await 语法，babel-runtime/regenerator 将您的异步函数转换为 ES6 生成器，这在 Node v4.3.2 和更新的运行时上受支持。

但在 Node v8.10 中，情况有所不同。 async/await 已经被支持，所以你不需要 Babel 将你的 async 函数转换为生成器。你只要正确使用它，它就可以工作。

至于您的具体情况，我假设您只是将 Javascript 代码更改为使用 async/await 代码，但您没有告诉 Babel 不要将您的 async/await 代码转换为生成器。这就是babel-runtime 抱怨缺少插件的原因。

如果是这种情况，您只需将 Babel 配置为简单地以 Node v8.10 为目标。你可以在你的.babelrc中这样做...

{
  "presets": [
    [
      "env",
      {
        "targets": {
          "node": "8.10"
        }
      }
    ]
  ]
}

babel 将停止转换那些async 函数。而且由于它不进行转换，因此不再需要regenerator-runtime。

Answer 2

就我而言，我将它与nodejs12.x 一起使用。我收到错误regeneratorRuntime 未定义。

我使用预设 es2015 和 stage-0 和 node12.x 代码。另外我使用的是旧版本的babel。

我做了什么，安装了：

"@babel/cli": "^7.10.1",
"@babel/core": "^7.10.2",
"@babel/preset-env": "^7.10.2"

然后设置这个 babel 预设：

"presets": [
    ["@babel/preset-env", {"targets": { "node": "current" }}]
]

谢谢，

Answer 3

要开始在 Webpack 构建的代码中使用 async / await，您需要 Babel 的一些帮助，特别是 babel-runtime 和 babel-plugin-transform-runtime。幸运的是，关于here on the Babel website 的安装和使用有一篇非常好的文章。你需要 Babel 为你做以下事情：

使用时自动需要 babel-runtime/regenerator 生成器/异步函数。

我不会重复那里写的内容，然而，特别要注意的是您需要如何安装这些，因为虽然他们的文章确实适用于大多数人，但有些人需要进行调整以前不需要运行时的 AWS Lambda 开发人员dependencies。

第一部分很正常，你需要新的devDependencies：

npm install --save-dev babel-plugin-transform-runtime

您还需要像他们描述的那样调整您的 .babelrc 文件：

{
  "plugins": [
    ["transform-runtime", {
      "helpers": false,
      "polyfill": false,
      "regenerator": true,
      "moduleName": "babel-runtime"
    }]
  ]
}

但这里是关键，这是上面代码的新内容：babel-runtime 是普通的dependencies，而不是devDependencies：

npm install --save babel-runtime

这 2 次安装和 .babelrc 调整确实解决了上述异步/等待问题，但它为上面的构建引入了一个新问题：Cannot find module 'babel-runtime/regenerator'。

如果您完全关心保持 Webpack 构建的代码较小，那么您可能也像上面的代码一样使用 webpack-node-externals。例如，aws-sdk for JavaScript in Node 非常大，并且已经在 Lambda 环境中可用，因此再次捆绑它是多余的。上面的webpack-node-externals 配置将Webpack 配置为默认忽略node-modules 中的所有模块，而那里 是新问题的根源。新安装的babel-runtime 是一个模块，需要在构建中捆绑才能使 Lambda 正确运行。

那么理解问题，答案就很简单了：不要使用默认配置。不要向webpack-node-externals 传递任何内容，而是像这样配置它：

externals: [nodeExternals({
  whitelist: [
    'babel-runtime/regenerator',
    'regenerator-runtime'
  ]
})], // ignore all modules in node_modules folder EXCEPT the whitelist

那解决了最初的 async / await 问题，以及如果您在构建中没有以前的 dependencies 可能会遇到的（可能的）新问题。希望对您有所帮助 — Lambda awaiting 快乐！