feat: add multi-platform deployment configuration

package.json

@@ -2,15 +2,23 @@
   "name": "react-vite-ui",
   "private": true,
   "homepage": "https://sheer-8kp.pages.dev/",
+  "deployments": [
+    "https://sheer-8kp.pages.dev/",
+    "https://mantrakp04.github.io/sheer",
+    "https://huggingface.co/spaces/mantrakp/sheer"
+  ],
   "version": "0.0.1",
   "type": "module",
   "scripts": {
     "dev": "vite",
     "build": "tsc -b && vite build",
+    "build:github": "tsc -b && vite build --mode github",
     "lint": "eslint .",
     "preview": "vite preview",
     "predeploy": "bun run build",
-    "deploy": "bun run build && npx wrangler pages deploy dist"
+    "deploy": "bun run build && npx wrangler pages deploy dist",
+    "deploy:gh-pages": "bun run build:github && gh-pages -d dist",
+    "deploy:all": "bun run deploy && bun run deploy:gh-pages"
   },
   "dependencies": {
     "@clerk/clerk-react": "^5.23.0",

src/App.tsx

@@ -9,11 +9,15 @@ import { HuggingFaceCallback } from "./pages/integrations/huggingface-callback";
 
 function App() {
   const queryClient = new QueryClient();
+  
+  // Get the base URL from Vite's import.meta.env
+  // This will be set based on the `base` option in vite.config.ts
+  const basename = import.meta.env.BASE_URL;
 
   return (
     <QueryClientProvider client={queryClient}>
       <LoadingProvider>
-        <BrowserRouter>
+        <BrowserRouter basename={basename}>
           <Routes>
             {routes.map((route) => (
               <Route

vite.config.ts

@@ -3,23 +3,31 @@ import react from "@vitejs/plugin-react";
 import { resolve } from "path";
 
 // https://vitejs.dev/config/
-export default defineConfig({
-  build: {
-    target: "esnext",
-  },
-  plugins: [react()],
-  resolve: {
-    alias: {
-      "@": resolve(__dirname, "./src"),
+export default defineConfig(({ mode }) => {
+  // Default base is '/' which works for most cases
+  // When deploying to GitHub Pages, we need to use the repo name as the base
+  // For Cloudflare Pages and HuggingFace, '/' works fine
+  const base = mode === 'github' ? '/sheer/' : '/';
+
+  return {
+    base,
+    build: {
+      target: "esnext",
+    },
+    plugins: [react()],
+    resolve: {
+      alias: {
+        "@": resolve(__dirname, "./src"),
+      },
     },
-  },
-  server: {
-    proxy: {
-      'http://localhost:11434': {
-        target: 'http://localhost:11434',
-        changeOrigin: true,
-        secure: false,
+    server: {
+      proxy: {
+        'http://localhost:11434': {
+          target: 'http://localhost:11434',
+          changeOrigin: true,
+          secure: false,
+        }
       }
     }
-  }
+  };
 });