【问题标题】:Correct implementation of babel with serverless使用 serverless 正确实现 babel
【发布时间】:2018-02-05 16:30:43
【问题描述】:

在我们的项目中,我们最近决定,对于某些实现,es6+ 函数让我们的生活变得更轻松。然而,这个“更简单”并没有被 babel 与 serverless 结合使用。

项目结构如下:

+
|- serverless.yaml
|- package.json
|- .babelrc
|- /src
   |- handler.js
   |- package.json
|- /test
   |- test.js

这显示了整个项目文件夹。以下是各个文件的源代码。

serverless.yaml

provider:
  name: aws
  runtime: nodejs6.10
functions:
  getHello:
    handler: handler.lambdaGetHello
    events:
      - http:
          path: api/hello
          method: GET
          authorizer: aws_iam
          cors: true
    package:
      include:
        - handler.js
        - node_modules/**

package.json(顶层,注意这可能包太多了,实际代码有更多的用法,但是清理这个可能是为了)

{
  "name": "Default-package-JSON-file",
  "version": "0.1.0",
  "description": "Simple serverless test",
  "scripts": {
    "build": "npm run build:init && npm run build:js && npm run build:install",
    "build:init": "rm -rf dist && mkdir dist && rm -rf src/node_modules && rm -rf src/test",
    "build:install": "cp src/package.json dist/ && cd dist && yarn",
    "build:js": "babel src --out-dir dist",
    "install-base": "npm run install-base:tld && npm run install-base:src",
    "install-base:tld": "yarn",
    "install-base:src": "cd src/ && yarn",
    "svl-deploy": "cp serverless.yaml dist/ && cd dist && serverless deploy",
    "test-dist": "cp -R test/ dist/ && cd dist && mocha",
    "test-src": "cp -R test/ src/ && cd src && mocha"
  },
  "author": "Mathieu Devos",
  "license": "UNLICENSED",
  "dependencies": {
    "add": "^2.0.6",
    "babel-runtime": "^6.26.0",
    "chai": "^4.0.1",
    "mocha": "^3.4.2",
    "serverless": "^1.20.2"
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-eslint": "^7.2.3",
    "babel-plugin-transform-async-to-generator": "^6.24.1",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-polyfill": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-register": "^6.26.0"
  },
  "private": true
}

.babelrc

{
  "plugins": [
    "transform-async-to-generator",
    "transform-runtime", {
        "polyfill": false,
        "regenerator": true
      }],
  "presets": ["es2015"]
}

src/handler.js(显然不是所有的东西都被定义了,这只是一个例子)。

async function hello(items = []) {
    const output = [];
    for (const item of items) {
        output.push(await item.handle());
    }
    return output;
};
module.exports.hello = hello;

const lambdaAddItems = (event, context, cb) => {
     const req = new Request(event);
     const args = context.args;
     magicFunction(hello, [args], callback);
};
module.export.lambdaHello = hello;

src/package.json(这个只包含了src中需要的所有不同的包,现在这个只包含了足够做Request的包)。

{
  "name": "source-package-json-file",
  "version": "0.1.0",
  "description": "Generic package module for source code",
  "scripts": {},
  "author": "Mathieu Devos",
  "license": "UNLICENSED",
  "dependencies": {
    "lambda-proxy-utils": "^1.2.4"
  },
  "devDependencies": {},
  "private": true
}

test/test.js(测试本地代码)。

const handler = ../handler.js;
const hello = handler.hello;
const lambdaHello = handler.lambdaHello;

...

Run the tests 

那么我们要如何运行这段代码呢?

我们有一个管道(或本地脚本,如果您愿意的话)来按顺序运行以下命令:

npm 运行安装基础 npm 运行测试-src npm 运行构建 npm 运行 test-dist npm run svl-deploy

不同命令的解释: 1) npm run install-base - 安装所有开发依赖项和命令以运行 linting、testing、babel 和 serverless。它还进入 /src 以在那里安装所需的 pacakges,以便 src 可以运行

2) npm run test-src - 将测试复制到 src 并运行它,这会将所有代码测试到本地文件夹(在本例中为 src 文件夹)

3) npm run build - 从 src 中删除 node_modules & test,使用 babel 将 src 转换为 dist(这实际上是正确翻译的)

4) npm run test-dist - 将测试复制到 dist 并运行它,这将测试到本地文件夹,在这种情况下是 dist。这里的问题是,如果没有 --require babel-polyfill 命令,这 not 工作。但是翻译完成了

5) npm run svl-deploy - 鉴于一切正常,部署到无服务器。


问题出现在第 4 步,如果我在没有 --require babel-polyfill 的情况下运行它,我会收到错误:

regeneratorRuntime is not defined

我可以通过给 mocha 提供以下命令来“修复”这个问题 --require babel-polyfill。

但是运行导致我的无服务器部署中断。

我现在的问题是:解决这个问题的“理智”方式是什么?如果可能的话,我想保持这样的文件夹概览,因为它确实清楚地显示了哪里需要什么,而不会使整体视图混乱。

BR, 马修

【问题讨论】:

    标签: node.js mocha.js aws-lambda babeljs serverless-framework


    【解决方案1】:

    答案隐藏在 babel 的转换运行时插件中。

    正确的 .babelrc 文件:

    {
      "plugins": [
        "transform-async-to-generator",
        "transform-runtime"
      ],
      "presets": ["es2015"]
    }
    

    在 src/package.json 中添加 babel-polyfill(因为需要使用它来部署无服务器)。

    强烈不推荐将 webpack 与无服务器结合使用等替代方案。

    【讨论】:

      猜你喜欢
      • 2019-07-07
      • 2015-11-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-07-17
      • 2019-01-27
      • 2020-12-05
      • 2017-12-21
      相关资源
      最近更新 更多