最終更新日：2024‐08-16
概要
local環境でRemixのプロジェクトをDocker上で動作させようとしていたところ、Docker起動時に以下のエラーが発生したので備忘録📝
Dockerfile、docker-compose.ymlを作成し、docker compose up を実行したタイミングで発生しました。
エラー内容
app-1 | /app/node_modules/@remix-run/server-runtime/dist/dev.js:17
app-1 | if (!origin) throw Error("Dev server origin not set");
app-1 | ^
app-1 | Error: Dev server origin not set
app-1 | at Object.broadcastDevReady (/app/node_modules/@remix-run/server-runtime/dist/dev.js:17:22)
app-1 | at Server.onListen (/app/node_modules/@remix-run/serve/dist/cli.js:125:17)
app-1 | at Object.onceWrapper (node:events:633:28)
app-1 | at Server.emit (node:events:531:35)
app-1 | at emitListeningNT (node:net:1931:10)
app-1 | at processTicksAndRejections (node:internal/process/task_queues:81:21)原因
環境変数、NODE_ENV=production が設定されていなかった。
（開発段階だったため、NODE_ENV=develop と設定していた。）
chatGPTに解析をお願いしたところ、環境変数に「REMIX_DEV_HTTP_ORIGIN=http://localhost:3000」を追加しなさい。というアドバイスももらったが、最終的には上記の環境変数を設定して、docker-compose.ymlで.envファイルを読み込むことで解決した。
docker-compose.yml
version: "3"
services:
app:
build:
context: .
dockerfile: Dockerfile
env_file:
- .env
ports:
- "${PORT}:3000"Dockerfile
# base node image
FROM node:21-bullseye-slim as base
# Install openssl for Prisma
RUN apt-get update && apt-get install -y openssl
# Install all node_modules, including dev dependencies
FROM base as deps
RUN mkdir /app
WORKDIR /app
ADD package.json package-lock.json ./
RUN npm install -g npm@10.x
# RUN npm install --save firebase
RUN npm install firebase
RUN npm install --production=false
# Setup production node_modules
FROM base as production-deps
ENV NODE_ENV production
RUN mkdir /app
WORKDIR /app
COPY --from=deps /app/node_modules /app/node_modules
ADD package.json package-lock.json ./
# RUN npm prune --production
# Build the app
FROM base as build
RUN mkdir /app
WORKDIR /app
COPY --from=deps /app/node_modules /app/node_modules
# ADD prisma .
# RUN npx prisma generate
ADD . .
RUN npm run build
# Finally, build the production image with minimal footprint
FROM base
RUN mkdir /app
WORKDIR /app
COPY --from=production-deps /app/node_modules /app/node_modules
COPY --from=build /app/build /app/build
COPY --from=build /app/public /app/public
ADD . .
CMD ["npm", "run", "start"].env
※４行目がポイント
PORT=3000
SOME_SECRET=hogehogepassword
NODE_ENV=production
FIREBASE_APIKEY=XXXXXXXXX
FIREBASE_AUTHDOMAIN=XXXXXXXXX
FIREBASE_PROJECTID=XXXXXXXXX
FIREBASE_STORAGEBUCKET=XXXXXXXXX
FIREBASE_MESSAGINGSENDERID=XXXXXXXXX
FIREBASE_APPID=XXXXXXXXX
FIREBASE_MEASUREMENTID=XXXXXXXXX
FIREBASE_FIRESTORE_URL=XXXXXXXXX
GOOGLE_APPLICATION_CREDENTIALS=XXXXXXXXX
SESSION_SECRET=XXXXXXXXX
RAKUTEN_API_APPLICATION_ID=XXXXXXXXX
GOOGLE_MAPS_API_KEY=XXXXXXXXX
HOT_PEPPER_API_KEY=XXXXXXXXX
Remixは日本語の情報が少ないので色々大変です。
技術の進化についていけていないシステムエンジニア。浅く広く、何でも大体はこなせるエンジニアで重宝されてる（つもり）。でもやっぱり特化した武器欲しい。
備忘録として記事を投稿していますが、少しでも誰かの助けになればと思います。
最近はプロジェクトでReact（TypeScript ）を触っています。
趣味でギター弾きます。