initr

Dockerfile

@@ -2,42 +2,36 @@
 FROM node:20-alpine AS builder
 WORKDIR /app
 
-# Install build dependencies
+# If you have native deps, keep these; otherwise you can remove
 RUN apk add --no-cache python3 make g++
 
-# Copy package files
+# Install deps with lockfile if available
 COPY package*.json ./
+RUN npm ci
 
-# Install all dependencies including devDependencies
-RUN npm install
-
-# Copy the rest of the application
+# Copy source and build
 COPY . .
-
-# Build the application
 RUN npm run build
 
 # Production stage
 FROM node:20-alpine
 WORKDIR /app
 
-# Copy package files
-COPY package*.json ./
-
-# Install only production dependencies
-RUN npm ci --omit=dev
-
-# Copy built assets from builder
+# Copy built assets
 COPY --from=builder /app/dist ./dist
 
-# Copy other necessary files (like public folder if exists)
-COPY public ./public
+# Copy Vite config so preview.allowedHosts is applied
+COPY vite.config.* ./
+
+# Install Vite to run the preview server at runtime
+RUN npm i --no-save vite@^5
 
-# Switch to non-root user
+# Non-root user
 USER node
 
-# Expose the port the app runs on
+# Hugging Face listens on PORT (default 7860)
+ENV PORT=7860
 EXPOSE 7860
 
-# Run the Vite preview server
-CMD ["npx", "vite", "preview", "--host", "--port", "7860"]
+# Serve the built app with Vite preview
+CMD ["sh", "-c", "node node_modules/vite/bin/vite.js preview --host 0.0.0.0 --port ${PORT:-7860}"]

vite.config.ts

@@ -1,40 +1,33 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
+import { defineConfig, ConfigEnv } from 'vite'
 import path from 'path'
 
-export default defineConfig({
-  plugins: [react()],
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, './src'),
+// Dynamic config so we don't require @vitejs/plugin-react during "preview"
+export default defineConfig(async ({ command }: ConfigEnv) => {
+  const plugins = []
+  if (command !== 'preview') {
+    const { default: react } = await import('@vitejs/plugin-react')
+    plugins.push(react())
+  }
+
+  return {
+    plugins,
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, './src'),
+      },
+    },
+    // Local dev only
+    server: {
+      host: '0.0.0.0',
+      port: 3000,
+      strictPort: true,
     },
-  },
-  server: {
-    host: '0.0.0.0',
-    port: 3000,
-    strictPort: true,
-    hmr: {
-      host: 'pranav8tripathi-chopfresh.hf.space',
-      protocol: 'wss',
-      port: 443
-    }
-  },
-  preview: {
-    host: true,
-    port: 7860,
-    strictPort: true,
-    allowedHosts: ['pranav8tripathi-chopfresh.hf.space'], // ✅ Add this line
-    headers: {
-      'Access-Control-Allow-Origin': '*',
-      'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, PATCH, OPTIONS',
-      'Access-Control-Allow-Headers': 'X-Requested-With, content-type, Authorization'
+    // Used on Hugging Face (production)
+    preview: {
+      host: '0.0.0.0',
+      port: 7860,
+      strictPort: true,
+      allowedHosts: ['pranav8tripathi-chopfresh.hf.space'],
     },
-    proxy: {
-      '^/.*': {
-        target: 'http://localhost:3000',
-        changeOrigin: true,
-        secure: false
-      }
-    }
   }
 })