@slicemachine/adapter-sveltekit v0.0
@slicemachine/adapter-sveltekit
adds support for SvelteKit in Slice Machine.
Dependencies and requirements
This package works in a SvelteKit project with slice-machine-ui
installed.
Installation
The best way to configure a project with Slice Machine is by running the following command in a SvelteKit project. This command will install @slicemachine/adapter-sveltekit
along with other Prismic packages and add Prismic-specific configurations to your project.
npx @slicemachine/init@latest
For more information on configuring a SvelteKit project with Slice Machine, see our SvelteKit guide.
If you want to install this package on its own, run this command:
npm install --save-dev @slicemachine/adapter-sveltekit
Usage
To use this adapter, specify it in the adapter
property of your slicemachine.config.json
file:
{
"repositoryName": "example-prismic-repo",
"adapter": "@slicemachine/adapter-sveltekit",
"libraries": ["./src/lib/slices"],
"localSliceSimulatorURL": "http://localhost:5173/slice-simulator"
}
You can also specify options for the adapter:
{
"repositoryName": "example-prismic-repo",
"adapter": {
"resolve": "@slicemachine/adapter-sveltekit",
"options": {
"typescript": true
}
},
"libraries": ["./src/lib/slices"]
}
Here are the available options:
format boolean | Determines if generated files should be formatted
using Prettier (default: |
typescript boolean | Determines if generated files should use TypeScript
rather than JavaScript (default: |
generatedTypesFilePath string | A filepath denoting where generated TypeScript types
will be saved (default: |
In order to simulate slices in Slice Machine, the adapter requires a page that renders the <SliceSimulator>
component from @slicemachine/adapter-sveltekit/simulator
. The URL for this page should be specified in the localSliceSimulatorURL
property of slicemachine.config.json
.
<script>
import { SliceSimulator } from "@slicemachine/adapter-sveltekit/simulator";
import { SliceZone } from "@prismicio/svelte";
import { components } from "$lib/slices";
</script>
<SliceSimulator let:slices>
<SliceZone {slices} {components} />
</SliceSimulator>