Zoombares Bild
Erlauben Sie vergrößerte Bilder in Ihrer Dokumentation
Verwendung
Ersetzen Sie img durch ImageZoom in Ihren MDX-Komponenten.
import { ImageZoom } from 'fumadocs-ui/components/image-zoom';
import defaultMdxComponents from 'fumadocs-ui/mdx';
return (
<MdxContent
components={{
...defaultMdxComponents,
img: (props) => <ImageZoom {...(props as any)} />,
// other Mdx components
}}
/>
);Jetzt wird der Bildzoom automatisch für alle Bilder aktiviert.
Bildoptimierung
Eine Standard-sizes-Eigenschaft wird für die <Image />-Komponente von Next.js definiert, wenn nicht angegeben.
AI Magic 3DDocs