sveltejs/kit · warning

`export const snapshot` is deprecated. Use the `snapshot` he

Error message

`export const snapshot` is deprecated. Use the `snapshot` helper from `$app/navigation` instead.

What it means

Page components used to export a `snapshot` object directly; SvelteKit 2 introduced the `snapshot` helper from `$app/navigation` (and `$app/state`) instead, so component exports can be removed. When a component still exports `snapshot`, the router captures it but warns once in DEV that the export form is deprecated.

Source

Thrown at packages/kit/src/runtime/client/client.js:709

	await Promise.all(promises).catch(noop);
}

function reset_invalidation() {
	invalidated.length = 0;
	force_invalidation = false;
}

let warned_snapshot_export = false;

/**
 * @param {number} index
 * @deprecated TODO 4.0 get rid of this
 */
function capture_snapshot(index) {
	if (props.components.some((c) => c?.snapshot)) {
		if (DEV && !warned_snapshot_export) {
			warned_snapshot_export = true;
			console.warn(
				'`export const snapshot` is deprecated. Use the `snapshot` helper from `$app/navigation` instead.'
			);
		}
		snapshots[index] = props.components.map((c) => c?.snapshot?.capture());
	}
}

/**
 * @param {number} index
 * @deprecated TODO 4.0 get rid of this
 */
function restore_snapshot(index) {
	snapshots[index]?.forEach((value, i) => {
		props.components[i]?.snapshot?.restore(value);
	});
}

function persist_state() {

View on GitHub (pinned to 03f1687fe6)

Solutions

1. Delete `export const snapshot` from the component
2. Import `{ snapshot }` from `$app/navigation` and use it at the call site to save/restore scroll and state
3. Store captured state explicitly if you need custom serialize/restore behaviour

Example fix

// before (+page.svelte)
export const snapshot = { capture: () => data, restore: (d) => (data = d) };
// after
import { snapshot } from '$app/navigation';
const snap = snapshot.capture();
// later: snapshot.restore(snap);

// detect deprecated component snapshot exports
import { readFileSync } from 'node:fs';
if (/export\s+const\s+snapshot/.test(readFileSync('+page.svelte', 'utf8'))) {
  console.warn('use `snapshot` helper from $app/navigation instead');
}

function exportsSnapshot(comp) { return comp != null && 'snapshot' in comp; }

When it happens

Trigger: A `+page.svelte`/`+layout.svelte` contains `export const snapshot = { capture, restore }`; navigation happens and `capture_snapshot` in packages/kit/src/runtime/client/client.js detects it via `props.components.some((c) => c?.snapshot)` and warns once.

Common situations: Code following SvelteKit 2 early-adopter docs or pre-release syntax before the helper API settled; component libraries exporting snapshot support in the old shape.

Related errors

• The `update({ invalidateAll })` option has been deprecated i
• The `goto(..., { replaceState: ${opts.replaceState} })` opti
• The `goto(..., { invalidateAll: ${opts.invalidateAll} })` op
• The `status` property of `handleError` is deprecated. Use `e
• The `message` property of `handleError` is deprecated. Use `

AI-assisted analysis of sveltejs/kit@03f1687fe6 (2026-09-02). Data as JSON: /api/errors/5f782ed5a1d11474. Report an issue: GitHub.