Rehype shiki 示例

下方包含多种代码块变体（标题、行号、行高亮、diff），配合复制按钮验证插件是否生效。

基础 TypeScript 代码（带标题 + 行号 + 行高亮）#

export function sum(a: number, b: number) {
  return a + b
}
console.log(sum(2, 3))

TSX 片段（高亮指定行）#

export default function Page() {
  return (
    <main>
      <h1 className="text-2xl font-bold">Hello</h1>
      <p>Welcome</p>
    </main>
  )
}

Diff 示例（展示新增/删除）#

- const greeting = 'Hello Wrold'
+ const greeting = 'Hello World'

JSON 示例（带行号）#

{
  "name": "yume",
  "private": true
}

长代码块（验证复制按钮）#

# 构建
pnpm build

# 开发
pnpm dev

# Lint
pnpm lint