代码高亮测试

这篇文章用来演示代码块的语法高亮效果,覆盖常用语言。

JavaScript

js
const greet = (name) => 'Hello, ' + name
const list = [1, 2, 3].map((n) => n * 2)
console.log(greet('AAABLOG'), list)

TypeScript

ts
interface User {
  id: number
  name: string
  active: boolean
}

const user: User = { id: 1, name: 'AAABLOG', active: true }
console.log(user)

Python

python
def fib(n):
    a, b = 0, 1
    for _ in range(n):
        a, b = b, a + b
    return a

print(fib(10))

CSS

css
.container {
  display: flex;
  gap: 16px;
  color: #22d3ee;
  border-radius: 8px;
}

HTML

html
<button class="btn" type="button">点我</button>

JSON

json
{
  "name": "AAABLOG",
  "version": "1.0.0",
  "private": true
}

高亮行

在语言名后用 {行号} 或 {起始-结束} 标记要高亮的行:

ts
const a = 1
const b = 2
const c = 3
console.log(a + b + c)

也支持范围高亮 {4-7} 标记多行:

ts
export async function fetchUserData(userId: number) {
  const cacheKey = `user:${userId}`
  const cached = await redis.get(cacheKey)
  if (cached) {
    // 命中缓存,直接返回
    return JSON.parse(cached) as UserData
  }
  const data = await db.query('SELECT * FROM users WHERE id = ?', [userId])
  if (!data) {
    // 用户不存在
    throw new NotFoundError(`User ${userId} not found`)
  }
  await redis.set(cacheKey, JSON.stringify(data), 'EX', 300)
  return data
}

Bash

bash
#!/usr/bin/env bash
# 一键构建并启动博客
set -euo pipefail

APP="AAABLOG"
echo "Building $APP ..."

pnpm install --frozen-lockfile
pnpm build

if [ -d ".output" ]; then
  echo "Build done"
else
  echo "Build failed" >&2
  exit 1
fi