代码块
展示代码块的各种变体。
使用方法
export default () => {
console.log('Code block');
};
```ts
export default () => {
console.log('Code block');
};
```
带标题
nuxt.config.ts
export default defineNuxtConfig({
// My Nuxt config
});
```ts [nuxt.config.ts]
export default defineNuxtConfig({
// My Nuxt config
});
```
高亮行
console.log('1');
console.log('2');
console.log('3');
console.log('4');
```ts {1,3-4}
console.log('1')
console.log('2')
console.log('3')
console.log('4')
```
行号
// line-numbers is enabled
const line2 = 'This is line 2';
const line3 = 'This is line 3';
```ts{1} line-numbers
// line-numbers is enabled
const line2 = 'This is line 2';
const line3 = 'This is line 3';
```
固定高度
const parsedMeta = computed(() => {
const split = meta?.split(' ') ?? [];
const params = new Map<string, string | undefined>();
for (const param of split) {
const [key, val] = param.split('=');
params.set(key, val);
}
return params;
});
```ts height=150
const parsedMeta = computed(() => {
const split = meta?.split(' ') ?? [];
const params = new Map<string, string | undefined>();
for (const param of split) {
const [key, val] = param.split('=');
params.set(key, val);
}
return params;
});
```
折叠代码
const parsedMeta = computed(() => {
const split = meta?.split(' ') ?? [];
const params = new Map<string, string | undefined>();
for (const param of split) {
const [key, val] = param.split('=');
params.set(key, val);
}
return params;
});
```ts height=150 collapse
const parsedMeta = computed(() => {
const split = meta?.split(' ') ?? [];
const params = new Map<string, string | undefined>();
for (const param of split) {
const [key, val] = param.split('=');
params.set(key, val);
}
return params;
});
```
自定义图标
Custom Icon
// line-numbers is enabled
const line2 = 'This is line 2';
const line3 = 'This is line 3';
```ts [Custom Icon] icon=lucide:code-xml line-numbers
// line-numbers is enabled
const line2 = 'This is line 2';
const line3 = 'This is line 3';
```
转换器
移除标记中的 \ 以启用转换器。
例如：// [\!code --] 改为 // [!code --]
差异
console.log('hewwo'); console.log('hello'); console.log('goodbye');
```ts
console.log('hewwo'); // [\!code --]
console.log('hello'); // [\!code ++]
console.log('goodbye');
```
错误级别
console.log('No errors or warnings');
console.error('Error'); console.warn('Warning'); ```ts
console.log('No errors or warnings');
console.error('Error'); // [\!code error]
console.warn('Warning'); // [\!code warning]
```
Focus
console.log('Not focused');
console.log('Focused'); console.log('Not focused');
```ts
console.log('Not focused');
console.log('Focused'); // [\!code focus]
console.log('Not focused');
```
Inline Code
code inline
const codeInline: string = 'highlighted code inline'
`code inline`
`const codeInline: string = 'highlighted code inline'`{lang="ts"}