如何使用 Webpack 配置 AWS Codebuild

Posted 2023-02-19

【中文标题】如何使用 Webpack 配置 AWS Codebuild

【英文标题】：How to configure AWS Codebuild with Webpack

【发布时间】：2021-04-15 20:56:12

【问题描述】：

我创建了一个分四个阶段运行的 AWS Codepipeline。 1) 来自 github 的源代码，2) 将后端部署到 Elastic Beanstalk，3) 使用 Codebuild 构建前端代码（使用下面的 buildspec 文件），以及 4) 将 webpack 的结果部署到 S3。

到目前为止，除了第 3 阶段的结果外，一切都按预期进行。Codebuild 似乎将工件设置为源文件，而不是 webpack 构建的结果。当我在存储桶和文件夹中查找已部署的代码时，我期望看到一系列 js 资产文件和 manifest.json。相反，我看到了项目文件。不太清楚我在这里配置错了什么。

buildspec.yml

version: 0.2

phases:
  install:
    runtime-versions:
      nodejs: 12
    commands:
      - echo Installing dependencies...
      - yarn
  build:
    commands:
      - echo Building project...
      - yarn build
  post_build:
    commands:
      - echo build completed on `date`

artifacts:
  files:
    - '**/*'

cache:
  paths:
    - '/root/.npm/**/*'
    - '/node_modules/'

webpack-build 配置

webpack-deploy 配置

【参考方案1】：

经过几个小时的故障排除，我终于能够弄清楚发生了什么。

在项目上运行 yarn build 会将所有内容捆绑到 /dist 文件夹中。但是，artifacts 行表明应该上传到 S3 的文件是所有项目文件。所以修复就像将**/* 更新为dist/**/* 一样简单。