【ブチギレ】monorepo構成時のAmplifyにGithub経由でfrontendをデプロイする際のハマりどころ

タイトルの通りですが、ブチギレました。嘘です。割とキレた程度です。

aws-exports.jsがないと怒られる

{
  "providers": [
    "awscloudformation"
  ],
  "projectName": "frontend",
  "version": "3.1",
  "frontend": "javascript",
  "javascript": {
    "framework": "react",
    "config": {
      "SourceDir": "src",
      "DistributionDir": ".next",
      "BuildCommand": "pnpm build",
      "StartCommand": "pnpm start"
    }
  }
}
version: 1
applications:
  - backend:
      phases:
        build:
          commands:
            - '# Execute Amplify CLI with the helper script'
            - amplifyPush --simple
    frontend:
      phases:
        preBuild:
          commands:
            - npm install -g pnpm
            - npx pnpm install
        build:
          commands:
            - npx turbo run build --filter=frontend
      artifacts:
        baseDirectory: apps/frontend/.next
        files:
          - '**/*'
      cache:
        paths:
          - node_modules/**/*
      buildPath: /
    appRoot: apps/frontend

このようなproject-config.jsonとamplify.yml(既にpnpmを使うための苦労が見えますが)でビルドを行っていた場合、aws-exports.jsがないとNext.jsに怒られてビルドができない問題に当たりました。 backend側でamplifyPush --simpleを先にやるべき、というのは仕組みも含めて理解していました。

ディレクトリの場所の問題なので単純にamplifyPushの前にcdなどを挟んでみたり、project-config.jsonのSourceDirをapps/frontend/src にしたりなどしましたが結局rootにつくられてしまいうまくいきませんでした。

解決法

amplifyPushの後にcp src/aws-exports.js apps/frontend/src と記述することで実行できるようになりました。 非自明すぎるしappRootが反映されてなさすぎて泣きました...

Additional: Next.js 13で、pnpmを使用している時にビルドサイズが大きすぎると言われる

解決法 npm config set node-linker hoistednpx pnpm install の前に入れる 知らんて〜!

以上