mirror of
https://github.com/supabase/supabase.git
synced 2026-09-06 09:59:03 +08:00
8d4d3b57e0
Makes the self-hosted Docker image buildable with the TanStack/Vite
build alongside the existing Next one. The Dockerfile's new
`STUDIO_FRAMEWORK` build arg (default: `next`) selects which framework
lands in the image — the same variable `scripts/dispatch.js` keys on
everywhere else, so `--build-arg STUDIO_FRAMEWORK=tanstack` is the
docker spelling of the existing switch. Both flavors assemble a
normalized `/srv` tree, so a single production stage serves either with
the same CMD (`node apps/studio/server.js`), port 3000, and healthcheck.
Unlike Next's self-contained standalone output, the Vite SSR bundle
externalizes studio's dependencies and resolves them from `node_modules`
at request time, so the tanstack runtime tree is a prod-only `pnpm
deploy` plus the built `dist/`. The boot smoke test runs a second time
against that pruned tree, so a runtime import that's missing from
`dependencies` fails the image build instead of 500ing the deployed
container — which is exactly how this PR caught four packages
misclassified as devDependencies (`braintrust` +
`@smithy/property-provider` via the AI routes, `libpg-query` via the
parse-query API route, `@radix-ui/react-use-escape-keydown` via the
Queues panel; split into its own commit).
**Changed:**
- `apps/studio/Dockerfile`: `ARG STUDIO_FRAMEWORK` selects `build-next`
/ `build-tanstack` stages via `FROM build-${STUDIO_FRAMEWORK}`; both
normalize into one production layout
- `apps/studio/package.json`: moved the four runtime-imported packages
from devDependencies to dependencies (versions unchanged)
- `apps/studio/vite.config.ts`: pinned `preview.host` to `127.0.0.1` —
the prerender step boots `vite preview` and crawls its resolved URL, and
the default `localhost` host lets the server bind the IPv6 loopback
while the crawler fetches `127.0.0.1`, which ECONNREFUSEDs the whole
build inside BuildKit containers
- `.github/workflows/studio-docker-build.yml`: builds the tanstack image
as a second step (reuses the first build's layer cache; job name
unchanged)
**Added:**
- `build:studio:docker:tanstack` root script
Note: the tanstack image is ~2.0GB vs ~1.2GB for Next (externalized
`node_modules`); shrinking it via file tracing is a follow-up. Nothing
self-hosters pull changes until a tanstack-built image is published —
this makes it buildable and CI-checked.
## To test
- `pnpm build:studio:docker` then run the image against a stack —
behavior unchanged (healthcheck `/api/platform/profile` 200, `/` 307s to
`/project/default`)
- `pnpm build:studio:docker:tanstack` then run that image with the same
env — same healthcheck, redirect, and data endpoints (projects, pg-meta)
respond 200; browser loads Project Overview / Table Editor with no
requests leaving the container
- Both verified locally against the CLI stack (`host.docker.internal`
env, container reports `healthy`)
- Vercel + e2e checks on this PR exercise the `preview.host` change on
their runners
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Added TanStack-based Studio build support with a framework-selectable
Docker image.
- Added a local build command for the TanStack Studio Docker image.
- **Build & Deployment**
- Updated the Studio Docker build workflow to also publish a
TanStack-tagged Studio image when relevant.
- **Bug Fixes**
- Improved `vite preview` behavior in containers by binding to IPv4
loopback.
- Standardized the Studio container runtime port to `3000`.
- **Chores**
- Updated Studio runtime packages to support the TanStack build.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
125 lines
5.3 KiB
Docker
125 lines
5.3 KiB
Docker
# To be run in the root of the turbo monorepo
|
|
# NOTE: It's highly recommended to use the new builder, Buildkit. https://docs.docker.com/build/buildkit/
|
|
## USAGE:
|
|
# Build (Next): docker build . -f apps/studio/Dockerfile --target production -t studio:latest
|
|
# Build (TanStack): docker build . -f apps/studio/Dockerfile --target production -t studio:latest --build-arg STUDIO_FRAMEWORK=tanstack
|
|
# Run: docker run -p 3000:3000 supabase/studio
|
|
# Deploy: docker push supabase/studio:latest
|
|
# Clean build:
|
|
# docker builder prune
|
|
# docker build . -f apps/studio/Dockerfile --target production -t studio:latest --no-cache
|
|
|
|
# Which framework's build ends up in the image. This is the same variable
|
|
# scripts/dispatch.js keys on for the dev/build/start scripts, so
|
|
# `--build-arg STUDIO_FRAMEWORK=tanstack` is the docker spelling of the
|
|
# switch used everywhere else. Framework selection happens at image build
|
|
# time (the two runtimes need different build outputs and dependency
|
|
# trees), not at container start.
|
|
ARG STUDIO_FRAMEWORK=next
|
|
|
|
FROM node:22-slim AS base
|
|
ENV PNPM_HOME="/pnpm"
|
|
ENV PATH="$PNPM_HOME:$PATH"
|
|
|
|
# Fixes issues with Sentry CLI and SSL certificates during build
|
|
# TODO: Git is added because it's needed to build libpg, remove it once they publish a binary on the S3 bucket
|
|
RUN apt-get update -qq && \
|
|
apt-get install -y --no-install-recommends \
|
|
git \
|
|
python3 \
|
|
ca-certificates \
|
|
build-essential && \
|
|
rm -rf /var/lib/apt/lists/* && \
|
|
update-ca-certificates
|
|
|
|
RUN npm install -g pnpm@11.13.1
|
|
|
|
WORKDIR /app
|
|
|
|
# Prune unneeded dependencies with turbo (from apps/ for example)
|
|
FROM base AS turbo
|
|
COPY . .
|
|
|
|
RUN pnpm dlx turbo@2.9.14 prune studio --docker
|
|
|
|
# Install dev dependencies (only if needed)
|
|
FROM base AS deps
|
|
COPY --from=turbo /app/out/json ./
|
|
COPY --from=turbo /app/out/pnpm-lock.yaml ./
|
|
COPY ./patches/ ./patches
|
|
|
|
# No need to clean cache because production uses standalone build
|
|
RUN pnpm install --frozen-lockfile
|
|
|
|
# dev contains dependencies and source code not compiled
|
|
FROM deps AS dev
|
|
COPY --from=turbo /app/out/full ./
|
|
ENTRYPOINT ["docker-entrypoint.sh"]
|
|
EXPOSE 8082
|
|
CMD ["pnpm", "dev:studio"]
|
|
|
|
# Compile Next.js
|
|
FROM dev AS build-next
|
|
RUN pnpm --filter studio exec next build
|
|
|
|
# Assemble the runtime tree at /srv in the layout the production stage
|
|
# serves from: Next's self-contained standalone output is the app root,
|
|
# with the static assets and public/ laid alongside it.
|
|
RUN mkdir -p /srv && \
|
|
cp -a apps/studio/.next/standalone/. /srv/ && \
|
|
mkdir -p /srv/apps/studio/.next && \
|
|
cp -a apps/studio/.next/static /srv/apps/studio/.next/static && \
|
|
cp -a apps/studio/public /srv/apps/studio/public
|
|
|
|
# Compile TanStack Start (Vite)
|
|
FROM dev AS build-tanstack
|
|
# build:tanstack = vite build --mode production, then a smoke test that
|
|
# boots the server bundle so module-scope crashes fail the image build.
|
|
RUN NODE_OPTIONS=--max-old-space-size=4096 pnpm --filter studio run build:tanstack
|
|
|
|
# Assemble the runtime tree at /srv. Unlike Next's standalone output, the
|
|
# Vite SSR bundle externalizes studio's dependencies and resolves them from
|
|
# node_modules at request time, so the tree is a prod-only `pnpm deploy` of
|
|
# studio (node_modules + manifest) plus the built dist/ and the runtime
|
|
# scripts. `scripts/serve.js` is the HTTP server (the same entry
|
|
# start:tanstack uses); the server.js shim gives the production stage a
|
|
# single CMD that works for both frameworks. `.env` is kept because
|
|
# serve.js loads it as the base of the runtime env cascade (container env
|
|
# vars always win over file values).
|
|
#
|
|
# --ignore-scripts: pnpm 11 hard-errors (ERR_PNPM_IGNORED_BUILDS) on
|
|
# dependency build scripts without an allowBuilds entry, and deploy turns
|
|
# the workspace packages into file: deps whose `only-allow pnpm` preinstall
|
|
# guards trip it. No lifecycle script is needed here anyway: the tree is
|
|
# fully prebuilt, and nothing in studio's prod graph is approved to build
|
|
# (allowBuilds only permits node-pty and supabase, both dev-only).
|
|
RUN pnpm --filter studio deploy --prod --legacy --ignore-scripts /srv/apps/studio && \
|
|
cd /srv/apps/studio && \
|
|
find . -mindepth 1 -maxdepth 1 \
|
|
! -name node_modules ! -name package.json ! -name scripts \
|
|
! -name instrument.server.mjs ! -name .env \
|
|
-exec rm -rf {} + && \
|
|
cp -a /app/apps/studio/dist ./dist && \
|
|
printf "import('./scripts/serve.js')\n" > server.js
|
|
|
|
# Boot the pruned tree exactly the way the container will run it, so a
|
|
# dependency that's runtime-imported but missing from `dependencies`
|
|
# (present only in devDependencies) fails the build here instead of
|
|
# 500ing the deployed container.
|
|
RUN cd /srv/apps/studio && node scripts/smoke-server.mjs
|
|
|
|
# Alias whichever framework build was selected so the production stage can
|
|
# COPY from a single stage name. BuildKit only builds the selected branch.
|
|
FROM build-${STUDIO_FRAMEWORK} AS build
|
|
|
|
# Copy only compiled code and dependencies
|
|
FROM base AS production
|
|
COPY --from=build /srv ./
|
|
# serve.js (TanStack) defaults to port 8082; pin both servers to the port
|
|
# the healthcheck and compose files expect. Next's server.js reads PORT too.
|
|
ENV PORT=3000
|
|
EXPOSE 3000
|
|
ENTRYPOINT ["docker-entrypoint.sh"]
|
|
HEALTHCHECK --interval=5s --timeout=5s --retries=3 CMD node -e "fetch('http://localhost:3000/api/platform/profile').then((r) => {if (r.status !== 200) throw new Error(r.status)})"
|
|
CMD ["node", "apps/studio/server.js"]
|