静的ビルド
Fumadocs で静的サイトを出力します。
セットアップ
Fumadocs はデフォルトでサーバーファーストのアプローチを採用しているため、稼働中のサーバーが必要です。 React Router を設定すれば、静的ビルドを出力できます。
静的ビルドにはサーバーが存在しないため、次の機能は動作しません。
また、ミドルウェアも実行されないため、Accept ヘッダーに応じた Markdown の配信も行われません。
検索
組み込み検索
設定が完了すると、検索インデックスがアプリに静的に保存され、検索処理はブラウザ側で行われるようになります。
クラウドソリューション
検索機能はリモートサーバーで動作するため、静的エクスポートでも追加の設定なしで利用できます。
デプロイ
SPA モードでは、build/client ディレクトリを静的サイトとして配信できます。
プリレンダリングを忘れずに
SPA モードでは、サーバーサイドのローダーをすべてプリレンダリングする必要があります。
詳細については、React Router のドキュメントを参照してください。
import type { Config } from '@react-router/dev/config';
import { glob } from 'node:fs/promises';
import { createGetUrl, getSlugs } from 'fumadocs-core/source';
const getUrl = createGetUrl('/docs');
export default {
// SSR を無効化
ssr: false,
async prerender({ getStaticPaths }) {
const paths: string[] = [...getStaticPaths()];
for await (const entry of glob('**/*.{md,mdx}', { cwd: 'content/docs' })) {
paths.push(getUrl(getSlugs(entry)));
}
return paths;
},
} satisfies Config;How is this guide?
最終更新日
