title |
---|
Migrating |
SvelteKit is largely backwards-compatible with Sapper. However, there are a number of differences.YOu may find it helpful to view the examples while migrating.
- Remove
rollup.config.js
orwebpack.config.js
and replace withvite.config.js
- Add a
svelte.config.cjs
with the adapter of your choice - Update your
template.html
toapp.html
- It should have a
<div id="svelte">
(orid
matchingtarget
insvelte.config.cjs
)
- It should have a
- The error and layout pages should prefixed by
$
instead of_
- Replace imports from
@sapper/app
with imports from$app/navigation
and$app/stores
and update APIs accordingly - If you have
src/node_modules/components
, move it tosrc/lib
and update the import path to$lib
- Move any custom
client.js
code to$layout.svelte
and put it in anif (browser)
check (import { browser } from "$app/env";
). preload
has been renamed toload
. It has a new method signature and return valuessapper:prefetch
andsapper:noscroll
have been renamed tosveltekit:prefetch
andsveltekit:noscroll