woodpecker:

.woodpecker.yml

@@ -0,0 +1,22 @@
+steps:
+  build:
+    image: node:20
+    commands:
+      - npm install -g pnpm
+      - pnpm install
+      - pnpm run build
+
+  deploy:
+    image: alpine
+    environment:
+      BASE_URL: /ddr
+    commands:
+      - apk add rsync openssh
+      - echo "$${SSH_SECRET_KEY}" > SSH_SECRET_KEY
+      - chmod 600 SSH_SECRET_KEY
+      - mkdir -p ~/.ssh
+      - echo "mzhang.io ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIO+RKFYjD8UjqhfOHFHNyijkbGzC4fJEIIhrBwHj+FsQ" >> ~/.ssh/known_hosts
+      - rsync -azrP -e "ssh -i SSH_SECRET_KEY" dist/ blogDeploy@mzhang.io:/home/blogDeploy/public/ddr
+    secrets: [SSH_SECRET_KEY]
+    when:
+      branch: master

src/App.tsx

@@ -19,7 +19,8 @@ import styles from "./App.module.scss";
 import Scores from "./pages/Scores";
 import Settings from "./pages/Settings";
 
-const router = createBrowserRouter([
+const router = createBrowserRouter(
+  [
     {
       path: "/",
       element: <AppWrapper />,
@@ -30,7 +31,11 @@ const router = createBrowserRouter([
         { path: "settings", element: <Settings />, handle: { navId: 2 } },
       ],
     },
-]);
+  ],
+  {
+    basename: import.meta.env.BASE_URL,
+  },
+);
 
 export function AppWrapper() {
   const navigate = useNavigate();

tsconfig.json

@@ -1,3 +1,7 @@
 {
-	"compilerOptions": { "jsx": "react-jsx" }
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "Node"
+  }
 }

vite.config.ts

@@ -4,6 +4,7 @@ import { VitePWA } from "vite-plugin-pwa";
 import basicSsl from "@vitejs/plugin-basic-ssl";
 
 export default defineConfig({
+  base: process.env.BASE_URL ?? undefined,
   server: {
     https: {},
   },