chore: support configuration for deployment to custom base path

website/src/components/templates/BaseTemplate.tsx

@@ -81,7 +81,7 @@ export const BaseTemplate: FC<BaseTemplateProps> = ({
 					rel="icon"
 					type="image/png"
 					sizes="32x32"
-					href="/assets/favicon.png"
+					href={`${basePath.replace(/\/$/, "")}/favicon.png`}
 				/>
 				<link
 					rel="preload"

website/src/components/ui/common/SearchWindow.tsx

@@ -5,13 +5,22 @@ import { CloseIcon } from "../../icons";
 export const SearchWindow: FC = () => {
 	return (
 		<div class="flex flex-col max-h-[80vh]">
-			<link
-				href={`${basePath.replace(/\/$/, "")}/pagefind/pagefind-ui.css`}
-				rel="stylesheet"
-			/>
-			<script src={`${basePath.replace(/\/$/, "")}/pagefind/pagefind-ui.js`} />
+			{import.meta.env.PROD && (
+				<>
+					<link
+						href={`${basePath.replace(/\/$/, "")}/pagefind/pagefind-ui.css`}
+						rel="stylesheet"
+					/>
+					<script
+						src={`${basePath.replace(/\/$/, "")}/pagefind/pagefind-ui.js`}
+					/>
+				</>
+			)}
 			<div class="flex justify-between items-center p-4 border-b border-gray-200 flex-shrink-0">
-				<h2 class="text-lg font-semibold">検索</h2>
+				<h2 class="text-lg font-semibold">
+					検索
+					{import.meta.env.DEV && <span> - Search disabled on DEV</span>}
+				</h2>
 				<button
 					type="button"
 					class="text-gray-400 hover:text-gray-600"

website/src/index.tsx

@@ -1,3 +1,4 @@
+import { serveStatic } from "@hono/node-server/serve-static";
 import { Hono } from "hono";
 import { appendTrailingSlash, trimTrailingSlash } from "hono/trailing-slash";
 import {
@@ -24,7 +25,7 @@ const [flattenedPages, pagePaths] = flattenDocs(docs);
 const allRoutes = flattenedPages.map((page) => page.route);
 registerRoutes(allRoutes);
 
-const app = new Hono();
+const app = new Hono().basePath(import.meta.env.DEV ? "/docs" : "/");
 app.use(appendTrailingSlash());
 app.use(trimTrailingSlash());
 
@@ -47,7 +48,7 @@ flattenedPages.forEach((page, pageIndex) => {
 
 	// Remove basePath from the route if it starts with basePath.
 	let route = page.route;
-	if (import.meta.env.PROD && route.startsWith(basePath)) {
+	if (route.startsWith(basePath)) {
 		route = route.slice(basePath.length - (basePath.endsWith("/") ? 1 : 0));
 	}
 	app.get(route, (c) => {
@@ -74,4 +75,19 @@ flattenedPages.forEach((page, pageIndex) => {
 	});
 });
 
+if (import.meta.env.DEV) {
+	app.use(
+		"*",
+		serveStatic({
+			root: "./public",
+			rewriteRequestPath: (path) => {
+				return path.slice(basePath.length);
+			},
+			onNotFound: (path, c) => {
+				console.log(`${path} is not found, request to ${c.req.path}`);
+			},
+		}),
+	);
+}
+
 export default app;