@ox-content/vite-plugin#

vp install @ox-content/vite-plugin

// vite.config.ts
import { defineConfig } from "vite";
import { oxContent } from "@ox-content/vite-plugin";

export default defineConfig({
  plugins: [
    oxContent({
      srcDir: "docs",
    }),
  ],
});

vpx oxct migrate vitepress .vitepress/config.ts \
  --src-dir docs \
  --out-dir dist \
  --out ox-content.config.ts

vpx oxct migrate vitepress .vitepress/config.ts --out ox-content.config.ts

oxContent({
  ssg: {
    enabled: true,
    extension: ".html",
    clean: false,
  },
});

oxContent({
  ssg: {
    bare: true, // ナビ / スタイルなしの最小 HTML
  },
});

oxContent({
  ssg: false, // SSG を切り、モジュール変換器としてだけ使う
});

import { renderMarkdown } from "@ox-content/vite-plugin";

const result = await renderMarkdown("# Hi", "/virtual/article.md", {
  ssg: false,
  highlight: false,
});

result.html;
result.frontmatter;
result.toc;

@import "@ox-content/vite-plugin/styles/core.css";
@import "@ox-content/vite-plugin/styles/markdown-tables.css";
@import "@ox-content/vite-plugin/styles/magic-links.css";
@import "@ox-content/vite-plugin/styles/social.css";
@import "@ox-content/vite-plugin/styles/twitter-full.css";
@import "@ox-content/vite-plugin/styles/reader-chrome.css";

import { createMarkdownEnvironment } from "@ox-content/vite-plugin";

export default defineConfig({
  environments: {
    markdown: createMarkdownEnvironment(resolvedOxContentOptions),
  },
});

// deno.ts
import { createOxContentFetchHandler } from "@ox-content/vite-plugin/router";

Deno.serve(
  createOxContentFetchHandler(
    {
      srcDir: "content",
      ssg: { routePrefix: "blog" },
    },
    Deno.cwd(),
  ),
);

// bun.ts
import { createOxContentFetchHandler } from "@ox-content/vite-plugin/router";

const fetch = createOxContentFetchHandler(
  {
    srcDir: "content",
    base: "/docs/",
    ssg: { routePrefix: "blog" },
  },
  import.meta.dir,
);

Bun.serve({ fetch });

import { createOxContentMiddleware } from "@ox-content/vite-plugin/router";

const oxContentPages = createOxContentMiddleware({ srcDir: "content" }, projectRoot, {
  middleware: [
    async (context, next) => {
      if (context.match.routePathname.startsWith("/drafts/")) {
        return new Response("Not Found", { status: 404 });
      }
      const response = await next();
      if (!response) return undefined;
      const headers = new Headers(response.headers);
      headers.set("x-ox-route", context.match.routePathname);
      return new Response(response.body, { headers, status: response.status });
    },
  ],
});

oxContent({
  highlight: true,
  codeAnnotations: {
    notation: "both",
  },
});

```ts annotate="highlight:1,6;warning:2;error:3"
export function loadUser(input: string) {
  if (!input) console.warn("missing payload");
  throw new Error("missing id");
}

const user = loadUser(payload);
console.log(user);
```

```ts:line-numbers=10 {1,4} [config.ts]
const user = loadUser(payload);
console.warn("Deprecated")
throw new Error("boom")
```

export function loadUser(input: string) {
  if (!input) console.warn("missing payload");
  throw new Error("missing id");
}

const user = loadUser(payload);
console.log(user);

oxContent({
  codeAnnotations: {
    metaKey: "markers",
  },
});

<GitHub repo="ubugeeei-prod/ox-content" />

<GitHub permalink="https://github.com/ubugeeei-prod/ox-content/blob/278098b/README.md#L1-L12" />

<GitHub repo="ubugeeei-prod/ox-content" path="README.md" ref="main" loc="1-12" />

<OgCard url="https://github.com/ubugeeei-prod/ox-content" />

oxContent({
  embeds: {
    github: {
      token: process.env.GITHUB_TOKEN,
      maxSourceBytes: 200000,
      maxSourceLines: 120,
    },
    openGraph: {
      timeout: 5000,
    },
    pm: true,
    reddit: true,
  },
});

oxContent({
  embeds: false,
});

.ox-github-card,
.ox-github-code,
.ox-ogp-card {
  border-color: var(--my-border-color);
}

.ox-github-code-line-number,
.ox-ogp-domain {
  color: var(--my-muted-color);
}

oxContent({
  docs: {
    enabled: true,
    src: ["./src"],
    out: "docs/api",
    include: ["**/*.ts"],
    exclude: ["**/*.test.*"],
    format: "markdown",
    toc: true,
    groupBy: "file",
  },
});

oxContent({
  docs: false, // 組み込み docs 生成をオプトアウト
});

oxContent({
  search: {
    enabled: true,
    limit: 10,
    prefix: true,
    placeholder: "Search documentation...",
    hotkey: "/",
  },
});

oxContent({
  search: false, // 組み込み検索を切る
});

import { search, searchOptions } from "virtual:ox-content/search";

// Search the index
const results = await search("query text", { limit: 5 });

// Scope search to the API reference
const apiResults = await search("@api transform", { limit: 5 });

// Results include:
// - id: document ID
// - title: document title
// - url: document URL
// - score: relevance score
// - snippet: text snippet with context

// vite.config.ts
import { defineConfig } from "vite";
import { defineCollection, oxContent } from "@ox-content/vite-plugin";

export default defineConfig({
  plugins: [
    oxContent({
      srcDir: "content",
      collections: {
        blog: defineCollection({
          source: "blog/**/*.md",
        }),
        docs: defineCollection({
          source: "docs/**/*.md",
          include: ["body"],
        }),
      },
    }),
  ],
});

import { queryCollection } from "virtual:ox-content/collections";

const posts = await queryCollection("blog")
  .where("draft", "=", false)
  .order("date", "DESC")
  .select("title", "path", "description")
  .all();

const page = await queryCollection("docs").path("/docs/getting-started").first();

// Client-side
if (import.meta.hot) {
  import.meta.hot.on("ox-content:update", (data) => {
    console.log("Markdown updated:", data.file);
  });
}

import config from "virtual:ox-content/config";
import { useMarkdown, withBase, withoutBase } from "virtual:ox-content/runtime";
import { search, searchOptions } from "virtual:ox-content/search";
import { queryCollection } from "virtual:ox-content/collections";

const assetUrl = withBase("/og.png");
const routePath = withoutBase("/docs/guide");

// Use the search function
const results = await search("query", { limit: 10 });

const page = await queryCollection("content").path("/guide").first();