設定

Methanol は、プロジェクトのルートにある以下の設定ファイルを自動的にスキャンします。

methanol.config.{js,mjs,cjs,ts,jsx,tsx,mts,cts}

設定ファイルが存在しない場合、カレントディレクトリを基準としたデフォルトの構成仕様が適用されます。

設定ファイルの基本構造

設定ファイルは、構築コンテキストを受け取り設定オブジェクトを返す関数を export する必要があります。

export default ({ mode, root, HTMLRenderer }) => ({
	// 各種設定値
})

コンテキストプロパティの説明:

主要なオプション設定

root

プロジェクトの基準となるディレクトリ。デフォルトはカレントディレクトリ（CWD）です。

site

テンプレート内で参照されるサイトのメタ情報。

注意点:

pagefind

Pagefind 全文検索の有効化および設定。デフォルト: false。

pagefind: false
// または
pagefind: { enabled: true }
// または詳細設定
pagefind: {
	enabled: true,
	excerptLength: 30,
	build: {
		outputSubdir: 'pagefind',
		verbose: true
	}
}

注意点:

feed

RSS/Atom フィードの生成を有効化します。デフォルト: false。

feed: true
// または
feed: {
	enabled: true,
	path: '/rss.xml',
	limit: 10,
	siteUrl: 'https://example.com',
	title: 'My Site',
	description: 'Updates from my site',
	language: 'en',
	atom: false
}

注意点:

pwa

Methanol の内蔵 PWA 機能（カスタム Service Worker とプリキャッシュマニフェスト）を有効化します。デフォルト: false。

pwa: true
// または
pwa: false
// または詳細設定
pwa: {
	manifest: {
		name: 'My Site',
		short_name: 'My Site'
	},
	precache: {
		include: ['**/*.{html,js,css,ico,png,svg,webp,jpg,jpeg,gif,woff,woff2,ttf}'],
		exclude: ['**/*.map', '**/pagefind/**'],
		priority: null,
		limit: null,
		batchSize: null
	}
}

注意点:

starryNight

構文ハイライト（rehype-starry-night）の制御。デフォルト: true。

starryNight: false
// または
starryNight: true
// または詳細設定
starryNight: {
	// rehype-starry-night に渡されるオプション
}

jobs

ビルド時のワーカースレッド数を指定します。デフォルト: 0（ページ数に応じた自動設定）。

jobs: 0 // 自動（round(ln(ページ数))、CPU コア数以内）
// または
jobs: 4

gfm

GitHub Flavored Markdown (GFM) の有効/無効設定。デフォルト: true。

有効な場合、GFM 特有の記法（テーブル、タスクリスト、取り消し線、脚注、自動リンクなど）がフルサポートされます。

gfm: true
// または
gfm: false

pagesDir

MDX/MD ソースファイルの配置ディレクトリ。デフォルトは pages です。pages/ が存在しない場合は、自動的に docs をスキャンします。

componentsDir

JSX/TSX コンポーネントの配置ディレクトリ。デフォルトは components です。

pagesDir や componentsDir を明示的に指定（CLI 引数を含む）した場合、対象のディレクトリが存在しないとビルドエラーとなります。

publicDir

静的アセットの配置ディレクトリ（サイトルート直下で配信されます。例: public/foo.png → /foo.png）。デフォルトは public です。

Methanol は、テーマ側の静的アセット（theme.publicDir）も同時に統合します。ユーザープロジェクト側のファイルと同名のパスが衝突した場合は、ユーザー側のファイルが優先的に適用されます。

統合が必要な際、内部的な作業ディレクトリとして node_modules/.methanol/assets（node_modules/ がない場合は {pagesDir}/.methanol/assets）が一時的に構築されます。

publicDir: false を設定すると、テーマ側のアセットを含め、静的アセットの配信機能が完全に無効化されます。

distDir

本番環境用ビルド成果物の出力先。デフォルトは dist です。

buildDir

ビルド時の中間作業用ディレクトリ（emitIntermediate 用）。デフォルトは build です。

emitIntermediate

true に設定すると、ビルド実行時に build/ ディレクトリへレンダリング後の中間 HTML ファイルを出力します。

theme

サイトに使用するテーマを設定します。テーマオブジェクト（下記参照）または文字列を指定可能です。文字列を指定した場合、以下の優先順位で解決されます。

  1. 組み込みテーマ: Methanol 内蔵のテーマ（default、blog など）と照合します。
  2. パッケージ解決: methanol-theme-xxx（xxx は入力された文字列）という名前のパッケージを検索します。

プロジェクト内のローカルテーマを使う場合は、methanol.config.* で import して theme に渡してください。

テーマオブジェクトの完全な仕様については、アドバンスド・テーマ を参照してください。

mdx

MDX のコンパイル設定をカスタマイズします。{ mode, root } を引数として受け取ります。

vite

Vite の設定を詳細にマージします。{ command, mode, root, isPreview } を引数として受け取ります。

preBuild / preBundle / postBundle / postBuild

ビルド一連のプロセスにフックを挿入するための設定です。

いずれも単一の関数、または関数の配列を指定可能です。

フックコンテキストの主要なプロパティ:

CLI による設定の上書きルール

コマンドライン引数で渡された値は、常に設定ファイルの値よりも優先されます。

設定ファイルの記述例

import tailwindcss from '@tailwindcss/vite'

export default ({ mode }) => ({
	site: { name: 'My Docs' },
	theme: {
		root: '.',
		template: ({ PageContent, ExtraHead, ctx, withBase, HTMLRenderer, components }) => (
			<>
				{HTMLRenderer.rawHTML`<!doctype html>`}
				<html lang="en">
					<head>
						<meta charset="UTF-8" />
						<meta name="viewport" content="width=device-width" />
						<ExtraHead />
						<title>{ctx.page.title || ctx.site.name}</title>
						<link rel="icon" href="/favicon.png" />
					</head>
					<body>
						{components.Callout ? <components.Callout>Hi</components.Callout> : null}
						<PageContent />
					</body>
				</html>
			</>
		),
		components: {
			Callout: ({ children }) => <div class="callout">{children}</div>
		}
	},
	mdx: () => ({
		development: mode !== 'production'
	}),
	vite: () => ({
		server: { port: 5173 },
		plugins: [tailwindcss()]
	})
})