🍬

[小ネタ]構築済のAmplify Consoleのビルド設定をモノレポに対応させる

2023/06/03に公開

あまり無いケースかもしれませんが、Amplify ConsoleでホスティングしているNext.jsアプリケーションをPolyrepoからMonorepoに変更する場合、ビルド設定に少し手間取ったため記録として残しておきます。

アプリケーションの構成

npm workspacesで管理していて、アプリケーションの構成は以下のようになっています。

├── packages
│   ├── app1 → Amplify Consoleにデプロイ
│   ├── app2
│   └── app3
├── tsconfig.json
├── package-lock.json
└── package.json

上記の app1 が Next.js のアプリケーションで既にAmplify Consoleにデプロイ済とします。
app2 app3 を今回のモノレポ対応で追加していますが、Amplify Consoleへのデプロイ対象は app1 のみとなります。

ビルド設定

公式ドキュメントに記載があるように以下の環境変数を設定する必要があります。

  • AMPLIFY_MONOREPO_APP_ROOT ... デプロイするパッケージのパス

今回はamplify.ymlに直接記載をしていきます。

version: 1
applications:
  - appRoot: packages/app1
    env:
      variables:
        AMPLIFY_MONOREPO_APP_ROOT: packages/app1
        AMPLIFY_DIFF_DEPLOY: false
    backend:
      phases:
        build:
          commands:
            - amplifyPush --simple
    frontend:
      phases:
        preBuild:
          commands:
            - npm install --workspace=app1
        build:
          commands:
            - npm run build --workspace=app1
      artifacts:
        baseDirectory: .next
        files:
          - "**/*"
      cache:
        paths:
          - node_modules/**/*

Polyrepoの時との変更点としては、applicationsのリストとしてビルド設定を定義しています。
appRootとAMPLIFY_MONOREPO_APP_ROOTの値は一致している必要があります。
backendもAmplifyのAPI機能を使ってデプロイしていますが、appRootを指定していればそのままamplifyPushでデプロイできます。
frontendのpreBuild, buildはworkspaceを指定して実行しています。

Discussion