코드 블록(동적)

코드도 강조 표시하는 코드 블록

사용법

import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';

<DynamicCodeBlock lang="ts" code='console.log("Hello World")' />;

This component, different from the MDX CodeBlock component, can be used without MDX. Shiki로 코드를 강조 표시하고 기본 구성 요소를 사용하여 렌더링합니다.

특징:

서버에서 사전 렌더링 가능
브라우저에 언어와 테마를 느리게 로드합니다.

옵션

import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';

<DynamicCodeBlock
  lang="ts"
  code='console.log("Hello World")'
  options={{
    components: {
      // add/override components
    },
    // or Shiki options
  }}
/>;

목차

코드 블록(동적) | 무료 AI 크리에이티브 스튜디오 | 3D, 이미지 및 비디오 생성기 | Magic3D