Ovellum v0.12.0
日本語

最終更新

検索#

Ovellum のサイト検索は、静的でクライアントサイドの検索エンジン Pagefind を利用しています。インデックスは ovellum build 時に、生成された HTML から構築されます。実行時には純粋にブラウザ + WebAssembly のみで動作し、サーバーも、外部サービスも、API キーも不要です。プレーンな静的ファイルとしてデプロイされ、あらゆるホストで動作します。

これはデフォルトでオフです。1 つのフラグでオンになります。

有効にする#

{
  "site": {
    "search": { "enabled": true }
  }
}

次のビルドで、2 つのことが起こります。

  1. インデックス作成。 サイトが書き出された後、Ovellum は出力ディレクトリに対して Pagefind を実行し、dist/pagefind/ フォルダ — 検索インデックス、WebAssembly ランタイム、デフォルト UI のアセット — を出力します。
  2. UI。 トップバーに検索ボックスが追加されます。⌘K / Ctrl-K を押してフォーカスすると、その下に浮かぶドロップダウンに結果が表示されます。

これでセットアップは全部です — ほかに設定はなく、Pagefind は Ovellum に同梱されているので、追加でインストールするものもありません。

仕組み#

  • ビルド時に構築し、ブラウザでクエリ。 Pagefind は各ページのレンダリングされた HTML を読み、コンパクトでチャンク化されたインデックスを書き込みます。小さな UI スクリプトはページとともに読み込まれます。インデックスデータ自体は、入力するにつれてオンデマンドでチャンク単位で取得されるので、大規模なサイトでも初期ページの重さは最小限に保たれます。
  • バックエンドなし。 すべてが静的ファイルとして dist/pagefind/ の下にあります。Algolia のアカウントも、稼働させるサービスも、同期し続けるものもありません — ほかのアセットと同じようにデプロイすれば、プレーンな CDN 上で検索が動作し続けます。
  • テーマに合わせたスタイリング。 デフォルトの Pagefind UI は、CSS 変数を通じて Ovellum のトークン(同じパレット、角丸、フォント)に合わせて再スタイリングされているので、light でも dark でもネイティブに見えます。

何がインデックスされるか#

Pagefind は各ビルド済みページのレンダリングされたコンテンツ — 見出しと本文テキスト — をインデックスするので、結果は読者が目にするものを正確に反映します。最終出力に対して実行されるため、自動生成された API ドキュメントも手書きのプローズも同じようにカバーします。インデックスは ovellum build のたびにゼロから再構築されます。

ホスティング#

  • dist/pagefind/ ディレクトリはビルド出力の一部です — ほかのすべてと一緒にアップロードしてください。ホスト側で設定する特別なことはありません。
  • サブパス(site.basePath)の下でも検索は動作します。UI は現在のページからの相対でインデックスを解決します。サブパス下でのホスティングを参照してください。

オフにする#

フラグを入れないでおくか、"enabled": false(デフォルト)に設定します。Pagefind は決して実行されず、dist/pagefind/ は出力されず、トップバーに検索ボックスも表示されません — ランタイムコストはゼロです。

設定リファレンスの site.search フィールドも参照してください。

このページを編集