Configuration
The theme exports its plugins from @staticbolt/docs/plugins and the Expressive Code options from @staticbolt/docs/ec-config. Everything else is the regular staticbolt pipeline. This is the config of this site:
import { defineConfig } from "@staticbolt/core";import * as plugins from "@staticbolt/core/plugins";import { rehypeExpressiveCodeOptions } from "@staticbolt/docs/ec-config";import * as theme from "@staticbolt/docs/plugins";import { toString } from "hast-util-to-string";import postcssPresetEnv from "postcss-preset-env";import rehypeAutolinkHeadings, { type Options as RehypeAutolinkHeadingsOptions } from "rehype-autolink-headings";import rehypeCallouts from "rehype-callouts";import rehypeKatex, { type Options as RehypeKatexOptions } from "rehype-katex";import remarkMath from "remark-math";
const siteUrl = "https://plant.codeberg.page/staticbolt-docs";
export default defineConfig({ plugins: [ plugins.loadSourcesPlugin({ include: ["./pages/**/*.{html,md}"] }), plugins.transformJsPlugin(), plugins.transformCssPlugin({ plugins: [postcssPresetEnv() as never] }), plugins.bundlePackagesPlugin(),
theme.markdownPlugin({ include: ["pages/**/*.{html,md}"], baseDirectory: "pages", layouts: { default: "@layouts/document.layout.html" }, customizations: { "~/index.md": {}, "~/getting-started.md": {}, "~/configuration.md": {}, "~/layout.md": {}, "~/styles.md": {}, "~/content.md": {}, "~/parts.md": {}, "~/plugins": { collapsed: false }, "~/plugins/markdown-plugin.md": {}, "~/plugins/code-block-plugin.md": {}, "~/plugins/expressive-code.md": {}, "~/plugins/rehype-plugins.md": {}, "~/plugins/pagefind-plugin.md": {}, "~/plugins/llms-plugin.md": {}, "~/plugins/assets-plugin.md": {}, "~/overriding.md": {}, }, }),
plugins.htmlEnvOnlyPlugin(), plugins.htmlLayoutPlugin({ tags: ["layout", "part", "icon"] }), plugins.htmlPagesPlugin(), plugins.htmlInsertPlugin(), plugins.htmlSvgoPlugin(), plugins.htmlBundleStylePlugin(), plugins.htmlBundleScriptPlugin(), plugins.htmlInlineScriptPlugin(), plugins.htmlInlineStylePlugin(), plugins.HtmlInlineSvgPlugin(), plugins.htmlInlineTextPlugin(), plugins.htmlIifeScriptPlugin(), plugins.htmlMarkdownPlugin(), plugins.htmlPreloadPlugin(), plugins.htmlFragmentPlugin(), plugins.htmlMergeStylesPlugin(), plugins.htmlBuildTimeScript(), theme.HtmlCodeBlockPlugin({ rehypeExpressiveCodeOptions }),
plugins.writeFilesPlugin({ clean: true, minify: { enabled: true } }), plugins.convertImagePlugin(), plugins.copyAssetsPlugin(), theme.assetsPlugin(), plugins.robotsTextPlugin({ rules: [{ userAgent: "*", allow: ["/"], disallow: [] }], sitemapUrl: `${siteUrl}/sitemap.xml` }), plugins.sitemapPlugin({ sitemapUrl: `${siteUrl}/` }), theme.pagefindPlugin(), theme.llmsPlugin({ siteUrl, title: "@staticbolt/docs", summary: "Documentation theme for staticbolt sites." }), plugins.analyzeOutputPlugin({ deleteUnused: true, exclude: ["pagefind/**", "robots.txt", "sitemap.xml", "llms.txt", "llms-full.txt", "**/*.md"], }),
plugins.developmentServerPlugin(), plugins.coreMarkdownPlugin({ allowDangerousHtml: true, remarkPlugins: [remarkMath], rehypePlugins: [ [rehypeKatex, { output: "mathml" } satisfies RehypeKatexOptions], theme.wrapTables, [ rehypeAutolinkHeadings, { behavior: "append", properties: node => ({ ariaLabel: toString(node) }) } satisfies RehypeAutolinkHeadingsOptions, ], rehypeCallouts, theme.rehypeMermaidFence, [theme.cachedRehypeExpressiveCode, rehypeExpressiveCodeOptions], ], }), theme.ecCachePlugin(), plugins.coreHtmlPlugin(), plugins.coreScriptPlugin(), plugins.coreStylePlugin(),
plugins.buildCliPlugin(), plugins.serveCliPlugin(), ],});Order matters
theme.markdownPluginruns before the HTML plugins, it rewrites the front matter that picks the layout.theme.HtmlCodeBlockPlugincomes afterhtmlBuildTimeScript, so code blocks written by build-time scripts get highlighted too.theme.pagefindPluginandtheme.llmsPluginrun afterwriteFilesPlugin, they read the output.theme.ecCachePlugincomes right aftercoreMarkdownPlugin, it persists whatcachedRehypeExpressiveCoderendered.
Opt-in features
| Feature | Install | Config |
|---|---|---|
| Callouts | rehype-callouts | rehypeCallouts, the callouts part |
| Math | remark-math, rehype-katex | remarkMath, rehypeKatex, assetsPlugin(), katex.css |
| Diagrams | mermaid | theme.rehypeMermaidFence, the mermaid part |
Leave out what the site does not need. tags in htmlLayoutPlugin must include "icon" when the sidebar uses icons.