Get Started: How to Create a KitBook

Warning: This is alpha software and not ready. Watch the updating [Roadmap] for clues on when that will be.

Install the kitbook package: npm i -D kitbook@alpha or pnpm add -D kitbook@alpha
Add the kitbook() Vite plugin before your sveltekit() plugin:

vite.config.js
js
import { sveltekit } from '@sveltejs/kit/vite';
import { kitbook } from 'kitbook/plugins/vite';
const config = {
	plugins: [
		kitbook(),
		sveltekit(),
	],
};
export default config;

Add these scripts to your package.json:

json
"kitbook": "vite dev --mode kitbook",
"kitbook:build": "svelte-kit sync && vite build --mode kitbook",
"kitbook:preview": "vite preview --mode kitbook",

Run npm kitbook or pnpm kitbook
Kitbook will quickly [initialize], and then you will want to add an asterisk to /.svelte-kit in your .gitignore file to modify it to /.svelte-kit* so the /.svelte-kit-kitbook folder isn’t committed.

At this point you can open Kitbook and see all your Svelte components, including +page.svelte and +layout.svelte files as they are also just plain Svelte components with a very important data prop.

Next you could…

Edit page on GitHub