設定

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
	}
}

注意点:

starryNight

構文ハイライト(rehype-starry-night)の制御。デフォルト: false

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

gfm

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

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

gfm: true
// または
gfm: false

pagesDir

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

componentsDir

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

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

publicDir

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

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

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

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

distDir

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

buildDir

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

emitIntermediate

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

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()]
	})
})