コードハイライト

Methanol は、Starry Night を使用してコードブロックの構文ハイライトを行います（rehype-starry-night 経由）。ビルドパフォーマンスと速度を優先するため、デフォルトでは無効に設定されています。

有効化と無効化

methanol.config.* 内で starryNight オプションを設定します。

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

明示的に無効化する場合:

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

CLI で一時的に切り替えることも可能です（1 回のビルドのみ有効）:

npx methanol build --code-highlighting
npx methanol build --code-highlighting false

ページ単位での設定上書き

各ページのフロントマター設定は、グローバル設定よりも優先されます。

---
starryNight: true
---

他のハイライターへの置き換え

Starry Night 以外のソリューションを使用する場合の手順:

1. starryNight: false で標準機能を無効化します。
2. mdx 設定オプションを通じて、任意のリハイク（rehype）プラグインを追加します。

export default () => ({
	starryNight: false,
	mdx: () => ({
		rehypePlugins: [/* 任意のハイライト用プラグイン */]
	})
})

スタイリング

Methanol は、ハイライト用の CSS を自動的に挿入しません。使用するテーマ側で必要なスタイルを読み込むか、独自にスタイル定義を用意してください。

サポート言語の追加

Starry Night には標準的な言語セットが含まれています。特定の言語を追加したい場合は、starryNight.grammars オプションを使用します。

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

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

※ 追加の文法データを読み込むには、プロジェクトに @wooorm/starry-night を直接インストールする必要があります。