📦 theme-live-codeblock

此主题提供一个由 react-live 驱动的 @theme/CodeBlock 组件。你可以在交互式代码编辑器文档中阅读更多相关信息。

npm

npm install --save @docusaurus/theme-live-codeblock

Yarn

yarn add @docusaurus/theme-live-codeblock

pnpm

pnpm add @docusaurus/theme-live-codeblock

Bun

bun add @docusaurus/theme-live-codeblock

配置

docusaurus.config.js

export default {
  plugins: ['@docusaurus/theme-live-codeblock'],
  themeConfig: {
    liveCodeBlock: {
      /**
       * 实时演示区域的位置，可以在编辑器上方或下方
       * 可选值: "top" | "bottom"
       */
      playgroundPosition: 'bottom',
    },
  },
};