GitHub 警报语法
nextra-theme-docs 和 nextra-theme-blog 支持在 .md/.mdx 文件中使用 <Callout> 组件替换
GitHub 警报语法 。
用法
Markdown
> [!NOTE]
>
> Useful information that users should know, even when skimming content.
> [!TIP]
>
> Helpful advice for doing things better or more easily.
> [!IMPORTANT]
>
> Key information users need to know to achieve their goal.
> [!WARNING]
>
> Urgent info that needs immediate user attention to avoid problems.
> [!CAUTION]
>
> Advises about risks or negative outcomes of certain actions.示例
Note
有用的信息，用户在快速浏览内容时也应该知道。
Tip
有助于更好地或更容易地完成事情的实用建议。
Important
用户需要知道的关键信息，以实现他们的目标。
Warning
需要用户立即关注以避免问题的紧急信息。
Caution
关于某些操作的风险或负面结果的建议。
在自己的主题中使用
如果您想在自己的主题和自己的 <Callout>
组件中利用此功能：
创建 <Blockquote> 组件
要创建 <Blockquote> 组件，首先从
nextra/components 导入 withGitHubAlert。然后通过
调用 withGitHubAlert 函数来创建 <Blockquote> 组件。
第一个参数应该是一个处理 GitHub 警报
语法的 React 高阶组件，第二个参数应该是您的标准 <blockquote>
组件。
type 属性可以是以下之一：
'note' | 'tip' | 'important' | 'warning' | 'caution'。
import { withGitHubAlert } from 'nextra/components'
const Blockquote = withGitHubAlert(({ type, ...props }) => {
return <MyCalloutComponent type={type} {...props} />
}, MyBlockquoteComponent)将 <Blockquote> 提供给 useMDXComponents
要使 <Blockquote> 组件可用，您应该将其集成到
useMDXComponents 函数中：
mdx-components.jsx
export function useMDXComponents(components) {
return {
blockquote: Blockquote,
...components
}
}Last updated on