Code 接受一段源码字符串并交给 Shiki 高亮。它重新导出 Astro 内置的 <Code>,默认挂上 Nimbus 的转换器,因此文件名标题、行高亮、diff、聚焦、错误与警告标注、词语高亮都可以直接用。
安装
nimbus-docs add code源码位于 src/components/ui/code/。
属性
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
code |
string | — | 是 | 要高亮的源码字符串。 |
lang |
string | — | 是 | 语言标识,例如 "ts"、"tsx"、"bash"。 |
meta |
string | — | 否 | Shiki meta,例如 title="src/foo.ts" {1,3-5},用于文件名框与行高亮。 |
示例
<Code code={snippet} lang="ts" meta='title="src/lib/cn.ts" {2}' />默认主题跟随站点的明暗模式(github-light 与 github-dark),传入 theme 或 themes 即可覆盖。页面正文里通常直接写围栏代码块,支持的标记见 代码块。
安装后记得在 src/components.ts 中注册,或在页面文件顶部导入。