添加 Next.js Web 应用

- 创建 Next.js + TypeScript + Tailwind CSS Web 应用 - 支持 Markdown 渲染和 GFM 格式 - 支持 Obsidian 风格 wiki 链接 [[Page|Label]] - 侧边栏导航，按分类组织页面 - 图片资源支持（通过 API 路由从 wiki/assets 提供） - 响应式设计 - 更新 README 添加 Web 应用使用说明
2026-04-13 20:54:14 +08:00
parent a58453865b
commit 3b6dc2e9fc
25 changed files with 8752 additions and 0 deletions
@@ -0,0 +1,93 @@
+import Link from "next/link";
+import { notFound } from "next/navigation";
+import { getAllPages, getPageBySlug, type WikiPage as WikiPageType } from "@/lib/wiki";
+import { Sidebar } from "@/components/Sidebar";
+
+export async function generateStaticParams() {
+  const pages = await getAllPages();
+  return pages.map((page) => ({
+    slug: page.slug,
+  }));
+}
+
+export default async function WikiPageComponent({
+  params,
+}: {
+  params: Promise<{ slug: string }>;
+}) {
+  const { slug } = await params;
+  const page = await getPageBySlug(slug);
+
+  if (!page) {
+    notFound();
+  }
+
+  const allPages = await getAllPages();
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      {/* Header */}
+      <header className="bg-white border-b border-gray-200 sticky top-0 z-10">
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+          <div className="flex items-center justify-between h-16">
+            <Link href="/" className="text-xl font-bold text-gray-900">
+              WikiLLM
+            </Link>
+            <nav className="flex items-center space-x-4">
+              <Link
+                href="/"
+                className="text-gray-600 hover:text-gray-900 px-3 py-2 rounded-md text-sm font-medium"
+              >
+                首页
+              </Link>
+            </nav>
+          </div>
+        </div>
+      </header>
+
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+        <div className="grid grid-cols-1 lg:grid-cols-4 gap-8">
+          {/* Sidebar */}
+          <aside className="lg:col-span-1">
+            <Sidebar pages={allPages} currentSlug={slug} />
+          </aside>
+
+          {/* Main content */}
+          <main className="lg:col-span-3">
+            <article className="bg-white rounded-lg shadow-sm p-8">
+              {/* Page header */}
+              <header className="mb-8 border-b border-gray-200 pb-4">
+                <h1 className="text-3xl font-bold text-gray-900 mb-2">
+                  {page.title}
+                </h1>
+                {page.frontmatter.last_updated && (
+                  <p className="text-sm text-gray-500">
+                    最后更新: {String(page.frontmatter.last_updated)}
+                  </p>
+                )}
+                {page.frontmatter.tags && page.frontmatter.tags.length > 0 && (
+                  <div className="mt-2 flex flex-wrap gap-2">
+                    {page.frontmatter.tags.map((tag: string) => (
+                      <span
+                        key={tag}
+                        className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800"
+                      >
+                        {tag}
+                      </span>
+                    ))}
+                  </div>
+                )}
+              </header>
+
+              {/* Page content */}
+              <div
+                className="prose-wikillm"
+                dangerouslySetInnerHTML={{ __html: page.html }}
+              />
+            </article>
+          </main>
+        </div>
+      </div>
+    </div>
+  );
+}