Run development on the production stack with a Vite dev server

docker-compose.dev.yml extends docker-compose.yml, so development runs the
scheduler too, and takes its settings from .env, which selects the file
through COMPOSE_FILE. The dev image is a stage of the Dockerfile and shares
the production image's PHP extensions; the app listens on port 80 as in
production.

A vite service runs the dev server with hot reload. No ports are published:
OrbStack serves https://app.sealshare.orb.local and
https://vite.sealshare.orb.local, with the ports pinned by label. Without
OrbStack, docker-compose.ports.yml publishes APP_PORT and VITE_PORT on
127.0.0.1. vite.config.js takes the dev server's address from
VITE_DEV_SERVER_URL and listens on IPv4 and IPv6, as OrbStack's proxy
connects over either.

Each start installs Composer packages, clears caches, migrates and links
storage.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

docker-compose.dev.yml

@@ -1,37 +1,78 @@
+# ============================================
+# SealShare - Development (extends docker-compose.yml)
+# ============================================
+#
+# The app and the scheduler extend the production services and change only what development needs.
+# Select this file in .env, then use plain `docker compose` commands:
+#   COMPOSE_FILE=docker-compose.dev.yml
+#
+# The checkout is mounted at /app, so changes apply without a rebuild: Octane reloads on PHP changes,
+# the Vite dev server hot-reloads CSS and JavaScript and reloads the page on Blade changes. Every other
+# value comes from .env through docker-compose.yml.
+#
+# No ports are published: OrbStack serves https://app.sealshare.orb.local and
+# https://vite.sealshare.orb.local. Elsewhere, add docker-compose.ports.yml to COMPOSE_FILE.
+#
+# ============================================
+
+# Only what differs between the host and the container: the host reads .env too.
+x-container-environment: &container-environment
+  # Compiled views stay in the container. The host shares storage/ through the mount, and
+  # compiled Livewire components hold absolute paths (/app/… here, the checkout's path there).
+  VIEW_COMPILED_PATH: /tmp/views
+  # The database file the host uses, not the production volume's path
+  DB_DATABASE: /app/database/database.sqlite
+
 services:
   app:
+    extends:
+      file: docker-compose.yml
+      service: app
+    # Its own name, so a development build never tags the published image
+    image: sealshare-dev
+    build:
+      target: dev
+    ports: !reset []
+    volumes: !override
+      - .:/app
+    environment: *container-environment
+    labels:
+      # OrbStack's port for https://app.sealshare.orb.local, instead of detecting it (it can keep a stale one)
+      dev.orbstack.http-port: "80"
+    healthcheck:
+      # The first start installs Composer packages
+      start_period: 5m
+      start_interval: 2s
+
+  scheduler:
+    extends:
+      file: docker-compose.yml
+      service: scheduler
+    image: sealshare-dev
+    build:
+      target: dev
+    volumes: !override
+      - .:/app
+    environment: *container-environment
+
+  vite:
+    image: sealshare-dev
     build:
       context: .
-      dockerfile: docker/dev.Dockerfile
-    ports:
-      - "8000:8000"
-      - "5173:5173"
+      dockerfile: Dockerfile
+      target: dev
+    entrypoint: ["sh", "-c", "npm install --no-audit --no-fund && exec node_modules/.bin/vite"]
     volumes:
       - .:/app
       # Its own node_modules: npm installs the build tools' native binaries for Linux here and for
       # the host's platform there, and a shared folder only ever holds one of them.
       - /app/node_modules
-    environment:
-      APP_KEY: ${APP_KEY:-}
-      APP_URL: http://localhost:8000
-      APP_ENV: local
-      # Compiled views stay in the container. The host shares storage/ through the mount, and
-      # compiled Livewire components hold absolute paths (/app/… here, the checkout's path there).
-      VIEW_COMPILED_PATH: /tmp/views
-      APP_DEBUG: "true"
-      SERVER_NAME: ":8000"
-      DB_CONNECTION: sqlite
-      LOG_CHANNEL: stack
-      LOG_LEVEL: debug
-      OCTANE_MAX_EXECUTION_TIME: "300"
-      PHP_UPLOAD_MAX_FILESIZE: "64M"
-      PHP_POST_MAX_SIZE: "64M"
-      PHP_MAX_EXECUTION_TIME: "300"
-      PHP_MAX_INPUT_TIME: "300"
-      PHP_MEMORY_LIMIT: "512M"
+    labels:
+      dev.orbstack.http-port: "${VITE_PORT:-5173}"
+    # The image's healthcheck asks the web server, which only the app service runs
     healthcheck:
-      test: ["CMD", "curl", "--silent", "--fail", "http://localhost:8000/up"]
-      interval: 30s
-      timeout: 5s
-      start_period: 30s
-      retries: 3
+      disable: true
+    depends_on:
+      # The stylesheet imports Livewire Material from vendor/, which the app's first start installs
+      app:
+        condition: service_healthy