【ブチギレ】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 hoisted
をnpx pnpm install
の前に入れる
知らんて〜!
以上