代码高亮

Methanol 基于 Starry Night 实现代码高亮(集成 rehype-starry-night)。该功能默认开启。

全局启停

默认已开启,可在 methanol.config.* 中设置 starryNight 进行调整:

// methanol.config.js
export default () => ({
	starryNight: true
})

显式禁用:

// methanol.config.js
export default () => ({
	starryNight: false
})

CLI 临时开关(单次构建生效):

npx methanol build --highlight # 本次启用
npx methanol build --no-highlight # 本次禁用

页面级配置覆盖

页面 Frontmatter 配置拥有最高优先级:

---
starryNight: true
---

集成第三方高亮方案

若需切换至其他高亮方案:

  1. 在配置文件中禁用 Starry Night(starryNight: false
  2. mdx 配置中加入你的插件
export default () => ({
	starryNight: false,
	mdx: () => ({
		rehypePlugins: [/* 你的高亮插件 */]
	})
})

样式定制

Methanol 不会自动注入高亮样式。通常由主题负责加载 CSS,开发者亦可自行引入 CSS 文件定义 Starry Night 样式。

语言自动加载

Methanol 会根据内容中的 fenced code 语言标记,自动加载 Starry Night 已支持的语法。一般无需手动配置。

仅在以下场景需要配置 starryNight.grammars

扩展语言支持

如需覆盖或扩展 grammar 集合,可在 starryNight.grammars 中显式指定:

import sourceMDX from '@wooorm/starry-night/source.mdx'

export default () => ({
	starryNight: {
		grammars: [sourceMDX]
	}
})

注意: 加载扩展语法前,需在当前项目中安装 @wooorm/starry-night 依赖。