fix: resolve favicon against basePath so it loads on Pages

2026-09-10 04:20:03 +00:00 · 2026-08-31 15:33:39 +07:00
parent 90995d7969
commit 75bc15138e
1 changed files with 6 additions and 1 deletions
@@ -1,16 +1,21 @@
 import Head from "next/head";
 import dynamic from "next/dynamic";
+import { useRouter } from "next/router";

 const AppWithoutSSR = dynamic(() => import("@/App"), { ssr: false });

 export default function Home() {
+    // On Pages the site is served under /pikachu, so a root-absolute icon path
+    // 404s. basePath is "" in dev and the configured prefix in the export.
+    const { basePath } = useRouter();
+
    return (
        <>
            <Head>
                <title>Pikachu Connect</title>
                <meta name="description" content="Classic Pikachu emoji matching game built with Phaser 3 and Next.js" />
                <meta name="viewport" content="width=device-width, initial-scale=1" />
-                <link rel="icon" href="/favicon.png" />
+                <link rel="icon" href={`${basePath}/favicon.png`} />
            </Head>
            <main>
                <AppWithoutSSR />