feat: add Docker development environment for frontend
Create containerized development setup for safe and consistent frontend development: Docker Configuration: - docker-compose.yml: Root-level orchestration with frontend service - frontend/Dockerfile.dev: Node.js 20 Alpine optimized for dev - Volume mounts for Hot Module Replacement (HMR) - Named volume for node_modules to avoid conflicts - Health check to verify service availability - Environment variables for file watching (CHOKIDAR_USEPOLLING) Vite Configuration Update: - vite.config.ts: Add server config for Docker compatibility - host: '0.0.0.0' to accept external connections - usePolling: true for file watching in container - port: 5173 explicitly configured Documentation: - README.md: Add Docker development procedure section - Document docker compose up -d workflow - Explain HMR and hot-reload capabilities - List advantages of Docker-based development Usage: docker compose up -d # Start development server docker compose logs -f # View logs docker compose down # Stop container Access: http://localhost:5173 Safety First: - Isolated environment prevents system conflicts - Reproducible setup across different machines - No host Node.js installation required - Easy team onboarding Refs: Docker best practices for Node.js development
This commit is contained in:
33
docker-compose.yml
Normal file
33
docker-compose.yml
Normal file
@@ -0,0 +1,33 @@
|
||||
# Docker Compose - LogWhisperer AI Development Environment
|
||||
# Usage: docker compose up -d
|
||||
# Access: http://localhost:5173
|
||||
|
||||
services:
|
||||
frontend:
|
||||
build:
|
||||
context: ./frontend
|
||||
dockerfile: Dockerfile.dev
|
||||
container_name: logwhisperer-frontend-dev
|
||||
ports:
|
||||
- "5173:5173"
|
||||
volumes:
|
||||
# Mount source code for Hot Module Replacement (HMR)
|
||||
- ./frontend:/app
|
||||
# Use named volume for node_modules to avoid conflicts with host
|
||||
- node_modules:/app/node_modules
|
||||
environment:
|
||||
- NODE_ENV=development
|
||||
- CHOKIDAR_USEPOLLING=true
|
||||
# Ensure container restarts on failure
|
||||
restart: unless-stopped
|
||||
# Health check to verify the service is running
|
||||
healthcheck:
|
||||
test: ["CMD", "wget", "-q", "--spider", "http://localhost:5173"]
|
||||
interval: 30s
|
||||
timeout: 10s
|
||||
retries: 3
|
||||
start_period: 40s
|
||||
|
||||
volumes:
|
||||
node_modules:
|
||||
driver: local
|
||||
Reference in New Issue
Block a user