組み込み機能#
Ox Content は、よく使うドキュメントの挙動を既定で載せ、非標準の Markdown や HTML 拡張はオプトインにします。
下の既定は @ox-content/vite-plugin と一致します。速い静的ベースライン向けです。パース、静的埋め込み、ソース docs、検索インデックスは変換時またはビルド時に走り、追加構文と実行時挙動は明示的にオンにします。
false または省略はオフ、true は既定でオン、オブジェクトはオンにしたうえで指定したフィールドだけ上書きします。
このドキュメントサイト自体が Ox Content でできています。下の機能ガイドは説明するだけでなく、機能をオンにして 実例をインラインで描画します。日本語ガイドは英語と同じ情報を載せます。
機能ガイド#
| ガイド | 内容 |
|---|---|
| Markdown の土台 | GFM、表、タスクリスト、脚注、autolink、frontmatter、TOC |
| コンポーネントマトリクス | 執筆 API、生成 HTML、アクセシビリティ、テーマフック、no/low-JS の挙動 |
| 見出しパーマリンク | 生成済み見出し id を再利用するオプトインの可視 # リンク |
| 構文拡張 | 絵文字ショートコード、Wiki リンク、属性構文、CJK 強調 |
| 相互参照 | セクション、図、表への label 付きリンク |
| 引用 | CSL JSON に基づく引用と生成 bibliography entry |
| BudouX | 日本語改行向けのビルド時フレーズ分割 |
| カスタムコンテナ | オプトインの ::: tip / ::: details |
| 条件付きブロック | オプトインの静的な ::: if / ::: else 分岐 |
| カード | オプトインの ::: card / ::: link-card / ::: card-grid |
| 手順リスト | オプトインの ::: steps |
| ファイル取り込み | オプトインの <!-- @include --> |
| Markdown パーシャル | オプトインのパラメータ付き <!-- @partial --> |
| ファイルツリー | オプトインの静的ディレクトリ図 |
| データテーブル | オプトインの csv-table / json-table 静的テーブル |
| インラインバッジ | オプトインの {badge:tip} |
| NotByAI バッジ | オプトインの静的な人の執筆開示(<NotByAI />) |
| キーボードキー | オプトインの {kbd:Ctrl+K} セマンティックなショートカット |
| 略語・用語集 | オプトインの *[TERM]: をアクセス可能な <abbr> へ展開 |
| 定義リスト | オプトインの Term / : definition 用語リスト |
| マジックリンク | オプトインの {link:@user} / エイリアス / label|url リッチリンク |
| 画像 | 図、キャプション、遅延読み込み、安全な寸法 |
| ページリソース | ページバンドル資産とリサイズ・クロップ・形式変換 |
| コードブロック | ハイライト、注釈、ソース取り込み |
| コードグループ | オプトインの VitePress 風 ::: code-group フェンスタブ |
| 埋め込み | GitHub / OG カード、パッケージマネージャタブ、YouTube、SNS |
| Mermaid | フェンスを静的 SVG に描画 |
| Graphviz DOT | DOT graph フェンスをサニタイズ済み静的 SVG に描画 |
| 数式 | オプトインの $…$ / $$…$$。任意依存の KaTeX で組版 |
| 検索 | 静的 BM25 インデックスとクライアント API |
| コレクション | Markdown を SQL 風ビルダで問い合わせ |
| 品質チェック | lint、型チェック、docs テスト、HTML サニタイズ |
| 型ホバー | twoslash フェンスのビルド時 TypeScript 型オーバーレイ |
| サイト生成 | SSG、OG 画像、編集リンク、API ドキュメント |
| 独自ホスト lifecycle | 独自 HTML ホスト向けの Vite loading、dev routing、invalidation、書き出し |
| Document assets | script、style、link、manifest、self-hosted asset の typed tag |
| SSG 出力プリミティブ | ssg: false 向けのリソース、併記、フィード、sitemap、lastmod |
| コンポーネント CSS | ssg: false と transformAllPlugins() 向けの公式 CSS |
| ページ head | ビルド時の Unhead 互換 title / meta / link / JSON-LD API |
| SEO | その API 上の canonical、robots、hreflang、検証 |
| 前へ / 次へ | サイドバー順の前後リンク |
| パンくず | ルートからサイドバー祖先までの道筋 |
| JSON-LD | オプトインの TechArticle / WebSite / BreadcrumbList |
| リーダー chrome | コピー、外部リンクアイコン、先頭へ戻る |
| ロケールスイッチャー | 設定したロケールへのヘッダー導線 |
| アクセシビリティ | スキップリンクと印刷スタイル |
| ヘッダー chrome | ナビ、告知バー、ページ単位の chrome |
| Sitemap / robots / llms.txt | クロール用マニフェスト |
| Markdown ソースの併記 | 生成 HTML の横に元の Markdown をオプトインで書き出す |
| 下書き / 非公開 / 予約公開 | frontmatter の公開状態 |
| パーマリンクと Cascade | 独自 URL とディレクトリ既定 frontmatter |
| リダイレクトとエイリアス | 静的 HTML リダイレクト |
| カスタム 404 | テーマ付き 404 |
| RSS / Atom / JSON フィード | コレクションからフィードを出力 |
| ブログ | ページ送り索引、著者、タグ、アーカイブ、任意の外部フィード |
| PWA マニフェストとサービスワーカー | Web アプリマニフェストと保守的なオフラインキャッシュ(クライアント JS を追加) |
| セルフホスト Iconify CSS | 使った Iconify アイコンのオプトイン CSS マスク(api.iconify.design なし) |
| タクソノミー | タグ / カテゴリの用語ページと関連ページ |
| ドキュメントのバージョン管理 | プレフィックス、凍結スナップショット、切替 UI |
| チーム / メンバー | layout: team の静的カード |
| Git コントリビューター | 各記事の下に一意の git 作者を出すオプトイン |
| セクション索引ページ | index.md がないディレクトリ向けの生成一覧 |
既定とオプトイン#
| 領域 | オプション | 既定 | ガイド |
|---|---|---|---|
| Markdown 土台 | gfm, footnotes, tables, taskLists, strikethrough, autolinks |
true |
Markdown の土台 |
| 意味的な脚注 | semanticFootnotes |
false |
Markdown の土台 |
| ページメタ | frontmatter |
true |
Markdown の土台 |
| ナビゲーション | toc, tocMaxDepth |
true, 3 |
Markdown の土台 |
| 見出しリンク | headingPermalinks / theme.headingPermalink |
false, "hover" |
見出しパーマリンク |
| 静的サイト | ssg |
{ enabled } |
サイト生成 |
| 独自 HTML ホスト | oxContentCustomHost |
公開 API | 独自ホスト lifecycle |
| Document assets | renderDocumentAssets |
公開 API | Document assets |
| 独自ホストの SSG 出力 | planSsgOutputs、writeResourceFiles、writeMarkdownCompanions、renderFeedFiles、writeFeedFiles、writeSiteMapFiles |
公開 API | SSG 出力プリミティブ |
| API ドキュメント | docs |
{ enabled } |
サイト生成 |
| 検索 | search |
{ enabled } |
検索 |
| コレクション | collections |
content |
コレクション |
| 静的埋め込み | embeds.github, embeds.openGraph |
true |
埋め込み |
| オプトイン埋め込み | embeds.pm, embeds.twitter, embeds.reddit, embeds.bluesky, embeds.qiita, embeds.zenn, embeds.packageRegistry, embeds.spotify, embeds.appleMusic, embeds.speakerDeck, embeds.audio, embeds.video, embeds.stackBlitz, embeds.webContainer |
false |
埋め込み |
| 構文ハイライト | highlight |
false |
コードブロック |
| コード執筆 | codeAnnotations, codeImports |
false |
コードブロック |
| コードグループ | codeGroups |
false |
コードグループ |
| 条件付きブロック | conditionalBlocks |
false |
条件付きブロック |
| 追加構文 | wikiLinks, emojiShortcodes, attrs, crossReferences / xrefs, citations, budoux, cjkEmphasis, containers, badges, notByAi, keyboardKeys, abbreviations, definitionLists, magicLinks |
false |
構文拡張 |
| ファイル取り込み | includes |
false |
ファイル取り込み |
| Markdown パーシャル | partials |
false |
Markdown パーシャル |
| カード | cards |
false |
カード |
| 手順リスト | steps |
false |
手順リスト |
| ファイルツリー | fileTree |
false |
ファイルツリー |
| データテーブル | dataTables |
false |
データテーブル |
| 画像 | images |
false |
画像 |
| ページリソース | resources |
false |
ページリソース |
| 図 | mermaid, graphviz |
false |
Mermaid, Graphviz DOT |
| 数式 | math |
false |
数式 |
| OG 画像 | ogImage |
false |
サイト生成 |
| HTML 安全 | sanitize |
false |
品質チェック |
| 編集リンク | editThisPage |
false |
サイト生成 |
| ページ送り | ssg.pagination |
false |
前へ / 次へ |
| パンくず | ssg.breadcrumbs / theme.breadcrumbs |
false |
パンくず |
| ページ head | renderHead |
ビルド時 | ページ head |
| SEO タグ | ssg.siteUrl、frontmatter robots / canonical |
設定時のみ | SEO |
| head 検証 | ssg.headValidation |
false |
SEO |
| 構造化データ | ssg.jsonLd |
false |
JSON-LD |
| リーダー chrome | ssg.readerChrome |
false |
リーダー chrome |
| Theme bootstrap | renderThemeBootstrapScript |
公開 API | テーマ |
| ロケールスイッチャー | ssg.localeSwitcher |
false |
ロケールスイッチャー |
| アクセシビリティ | ssg.a11y |
false |
アクセシビリティ |
| ヘッダー chrome | theme.nav, theme.announcement, ssg.pageChrome |
オフ | ヘッダー chrome |
| クロール | siteMaps |
false |
Sitemap / robots / llms.txt |
| Markdown ソース | ssg.markdownSource |
false |
Markdown ソースの併記 |
| 公開状態 | publishState |
false |
下書き / 非公開 / 予約公開 |
| パーマリンク | permalinks |
false |
パーマリンクと Cascade |
| frontmatter 継承 | cascade |
false |
パーマリンクと Cascade |
| リダイレクト | redirects |
false |
リダイレクトとエイリアス |
| カスタム 404 | ssg.notFound |
false |
カスタム 404 |
| フィード | feeds |
false |
RSS / Atom / JSON フィード |
| ブログ | blog / ssg.blog |
false |
ブログ |
| PWA | pwa |
false |
PWA マニフェストとサービスワーカー |
| セルフホストアイコン | icons |
false |
セルフホスト Iconify CSS |
| ドキュメント版 | versions |
false |
ドキュメントのバージョン管理 |
| タクソノミー | taxonomies |
false |
タクソノミー |
| チームページ | ssg.team |
false |
チーム / メンバー |
| Git 作者 | ssg.contributors |
false |
Git コントリビューター |
| セクション索引 | ssg.sectionIndex |
false |
セクション索引ページ |
| コード検査 | codeBlockLint, codeBlockTypecheck, docsTests |
false |
品質チェック |
| 型ホバー | typedHover |
false |
型ホバー |
| 独自パイプライン | transformers |
[] |
サイト生成 |
タブと YouTube 埋め込みにオプションはありません。SSG と dev preview では常に処理されます。埋め込み を見てください。
設定例#
import { defineConfig } from "vite-plus";
import { oxContent } from "@ox-content/vite-plugin";
export default defineConfig({
plugins: [
oxContent({
highlight: true,
emojiShortcodes: true,
codeAnnotations: {
notation: "both",
},
embeds: {
pm: { sync: true },
twitter: { fetch: true },
bluesky: true,
},
}),
],
});
どのオプションも同じ約束です。false は機能を切り、true は既定でオン、オブジェクトはオンにしたうえで指定したフィールドだけ上書きします。
コピーできる執筆例はリポジトリの examples/builtin-features/content/ にあります。事例 のページは、いくつかの機能を実行可能なプロジェクトで見せます。