Introduction
Pass theme option to sveltepress to use a theme
Read Vite plugin options and Default theme options for more details
| Choose | Best for | Content model | Search |
|---|---|---|---|
| Default theme | Documentation, product guides, API references | SvelteKit routes written as Markdown or Svelte | Algolia DocSearch or Meilisearch through a custom wrapper (see the production caveat) |
| Blog theme | Editorial sites and chronological publications | Markdown files in src/posts plus generated routes | Built-in Pagefind integration |
Default theme
Install
npm install --save @sveltepress/theme-defaultyarn add @sveltepress/theme-defaultpnpm install @sveltepress/theme-defaultbun add @sveltepress/theme-defaultAdd in your vite config
import { const defaultTheme: ThemeDefaultdefaultTheme } from '@sveltepress/theme-default'
import { const sveltepress: (options?: SveltepressVitePluginOptions) => PluginOptionsveltepress } from '@sveltepress/vite'
import { function defineConfig(config: UserConfig): UserConfig (+5 overloads)Type helper to make it easier to use vite.config.ts
accepts a direct
UserConfig
object, or a function that returns it.
The function receives a
ConfigEnv
object.
defineConfig } from 'vite'
const const config: UserConfigconfig = function defineConfig(config: UserConfig): UserConfig (+5 overloads)Type helper to make it easier to use vite.config.ts
accepts a direct
UserConfig
object, or a function that returns it.
The function receives a
ConfigEnv
object.
defineConfig({
UserConfig.plugins?: PluginOption[] | undefinedArray of vite plugins to use.
plugins: [
function sveltepress(options?: SveltepressVitePluginOptions): PluginOptionsveltepress({
SveltepressVitePluginOptions.theme?: ResolvedTheme | undefinedtheme: function defaultTheme(themeOptions?: DefaultThemeOptions | undefined): ResolvedThemedefaultTheme(/** theme options */)
})
],
})
export default const config: UserConfigconfigGet more info about default theme in Default theme reference
Blog theme
The blog theme adds post indexing, pagination, tags, categories, RSS, Open Graph images, related posts, comments, and a Pagefind search UI. It generates a static site and currently requires @sveltejs/adapter-static plus a Pagefind post-build step.
Start with the blog theme guide and use the live demo as the runnable reference.