# Multi-stage Dockerfile for Attune Web UI # Builds the React app and serves it with Nginx ARG NODE_VERSION=20 ARG NGINX_VERSION=1.25-alpine # ============================================================================ # Stage 1: Builder - Build the React application # ============================================================================ FROM node:${NODE_VERSION}-alpine AS builder WORKDIR /build # Copy package files COPY web/package.json web/package-lock.json ./ # Install dependencies RUN npm ci --no-audit --prefer-offline # Copy source code COPY web/ ./ # Build the application RUN npm run build # ============================================================================ # Stage 2: Runtime - Serve with Nginx # ============================================================================ FROM nginx:${NGINX_VERSION} AS runtime # Remove default nginx config RUN rm /etc/nginx/conf.d/default.conf # Copy custom nginx configuration COPY docker/nginx.conf /etc/nginx/conf.d/attune.conf # Copy built assets from builder COPY --from=builder /build/dist /usr/share/nginx/html # Copy environment variable injection script COPY docker/inject-env.sh /docker-entrypoint.d/40-inject-env.sh RUN chmod +x /docker-entrypoint.d/40-inject-env.sh # Create config directory for runtime config RUN mkdir -p /usr/share/nginx/html/config # Expose port 80 EXPOSE 80 # Health check HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \ CMD wget --no-verbose --tries=1 --spider http://localhost/health || exit 1 # Nginx will start automatically via the base image entrypoint