Obsidian
Render an Obsidian vault directly with Fumapress.
The @fumapress/obsidian package connects the runtime source from fumadocs-obsidian to Fumapress. Vault notes are compiled in memory without generating intermediate MDX files, and the renderer stays on the server.
Supported Obsidian syntax includes wikilinks and embeds, callouts, block IDs, and comments.
Installation
Install the integration:
npm i @fumapress/obsidianImport its Tailwind source after the Fumadocs UI styles:
@import "@fumapress/obsidian/css/preset.css";Configuration
For a runnable project, see examples/obsidian.
Create the vault source once, pass its dynamic source to Fumapress, and register obsidianPlugin() with the same source:
import { obsidian, obsidianPlugin } from "@fumapress/obsidian";
import { defineConfig } from "fumapress";
const vault = obsidian({
dir: "public/vault",
// Map attachments to URLs served from the public directory.
url: (file) => `/vault/${file}`,
});
export default defineConfig({
content: vault.dynamicSource(),
}).plugins(obsidianPlugin(vault));page.data.load() compiles a note at most once per vault snapshot. Media files are mapped to URLs and are not read into memory. Ambiguous wikilinks resolve like Obsidian: notes take precedence over attachments, then the shortest path wins.
Development Watching
The Fumapress plugin registers the vault with Vite in development. Add its Vite companion to receive file changes and reload the page:
import { obsidianVitePlugin } from "@fumapress/obsidian/vite";
import tailwindcss from "@tailwindcss/vite";
import press from "fumapress/vite";
import { defineConfig } from "waku/config";
export default defineConfig({
vite: {
plugins: [press(), obsidianVitePlugin(), tailwindcss()],
},
});Because wikilinks and aliases can create cross-file dependencies, a vault change invalidates the source snapshot. Only changed files are read from disk again.
Set watch: false when another process owns invalidation:
obsidianPlugin(vault, { watch: false });Rendering
The plugin supplies Fumadocs MDX components, Obsidian callout components, and relative-link resolution. Add or replace components through components:
obsidianPlugin(vault, {
components: {
img: (props) => <img {...props} className="rounded-xl" />,
},
});The same compiled representation supplies the page body, table of contents, structured search data, and plain text for LLM exports.
Prop
Type
Vault Schema
The source accepts Standard Schema validators for frontmatter and meta.json files. It also supports additional remark and rehype plugins for syntax such as Mermaid and math. See the Fumadocs Obsidian integration guide for the complete source configuration.
Last updated on
