fix: load image

components/logo.tsx

@@ -6,7 +6,7 @@ import React from "react";
 const Logo = ({ hasText }: { hasText?: boolean }) => {
   return (
     <Link href={"/"} className="flex w-fit items-center gap-2 z-10">
-      <Image src="/logo.png" width={40} height={40} alt="logo_image" />
+      <Image src="/speaker-ui/logo.png" width={40} height={40} alt="logo_image" />
       <div
         className={cn(
           "relative overflow-hidden rounded-full p-[1px] focus:outline-none focus:ring-2 focus:ring-neutral-400 focus:ring-offset-2 focus:ring-offset-neutral-50",

next.config.mjs

@@ -1,4 +1,28 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {};
+const nextConfig = {
+  /**
+   * Enable static exports for the App Router.
+   *
+   * @see https://nextjs.org/docs/app/building-your-application/deploying/static-exports
+   */
+  output: "export",
+
+  /**
+   * Set base path. This is usually the slug of your repository.
+   *
+   * @see https://nextjs.org/docs/app/api-reference/next-config-js/basePath
+   */
+  basePath: "/speaker-ui",
+
+  /**
+   * Disable server-based image optimization. Next.js does not support
+   * dynamic features with static exports.
+   *
+   * @see https://nextjs.org/docs/pages/api-reference/components/image#unoptimized
+   */
+  images: {
+    unoptimized: true,
+  },
+};
 
 export default nextConfig;