Next.js-dokumentation på Fumadocs
Layouter, en startsida och SEO-hjälpfunktioner för dokumentationswebbplatser byggda med Next.js och Fumadocs.
npm install onedocs fumadocs-core fumadocs-mdx fumadocs-ui lucide-react@0.562Senaste versionen 0.1.27 MIT Next.js 16, Node 20.9+
import { HomePage, CTASection } from "onedocs";
export default function Home() {
return (
<HomePage config={config} packageName="my-package">
<CTASection
title="Ready to get started?"
cta={{ label: "Read the Docs", href: "/docs" }}
/>
</HomePage>
);
}I praktiken
Onedocs skickar ett konfigurationsobjekt till layouterna Fumadocs UI.
En konfiguration, en layout
onedocs.config.ts innehåller webbplatstiteln, beskrivningen och GitHub-kodförrådet, och DocsLayout läser det tillsammans med sidträdet från din Fumadocs-källa.
Layouten återger sidofältet, temaväxlaren, en GitHub-länk byggd från nav.github och sökrutan, som söker via en /api/search-rutt som du lägger till.
Kom igång-guiden visar de övriga filerna: innehållskällan, konfigurationen Next.js, rotlayouten och sidrutten.
import { defineConfig } from "onedocs/config";
export default defineConfig({
title: "My Docs",
description: "Documentation for my project",
nav: {
github: "username/repo",
},
});import { DocsLayout } from "onedocs";
import type { ReactNode } from "react";
import { source } from "@/lib/source";
import config from "../../../onedocs.config";
export default function Layout({ children }: { children: ReactNode }) {
return (
<DocsLayout config={config} pageTree={source.pageTree}>
{children}
</DocsLayout>
);
}Färdiga layouter
DocsLayout, DocsPage och HomePage ger dig ett dokumentationsskal med sidofält, sökning och innehållsförteckning, plus en landningssida.
En konfigurationsfil
defineConfig() i onedocs.config.ts anger titeln, beskrivningen, logotypen, navigeringslänkarna, sidfoten samt startsidans hero och funktioner.
Markdown först
Skriv .md- eller .mdx-filer i din innehållsmapp, med syntaxmarkering och en innehållsförteckning på varje sida.
Sök
Fumadocss inbyggda Orama-sökning. Lägg till en API-rutt med createFromSource så använder sökrutan den.
Mörkt läge
Ljus och mörk temastil kommer från Fumadocs UI, och dokumentationslayouten innehåller dess temaväxlare. Logotyper och favikoner kan ha ljusa och mörka varianter.
Redo för TypeScript
Stöd för TypeScript med typsäker konfiguration och automatisk komplettering i din redigerare.
SEO och llms.txt
Hjälpfunktioner för sitemap.xml, robots.txt, llms.txt, llms-full.txt, sidmetadata och Open Graph-bilder.
Anpassningsbart
Möjlighet att använda Fumadocs-komponenter när du behöver mer kontroll över dokumentationen.
Utforska den kompletta guiden för Onedocs, från installation och första användning till avancerade arbetsflöden och API-detaljer.