Svelte +Vite: writable store in Typescript, cannot import Writable<T> interface

Question

In a Svelte project scaffolded using Vite I try to write a Svelte store in Typescript; having troubles with importing Writable<T> interface like below:

import { Writable, writable, derived } from 'svelte/store';

This results in the following error in a browser console:

Uncaught SyntaxError: The requested module '/node_modules/.vite/svelte_store.js?v=16f52463' does not provide an export named 'Writable'.

Is there any way to import Writable<T> interface in such a setup?

Answer 1

Use import type { Writable } from 'svelte/store';.

Update: From TypeScript 4.5 onwards you should be able to do all imports in one line. So instead of

import type { Writable } from 'svelte/store';
import { writable, derived } from 'svelte/store';

you can do

import { type Writable, writable, derived } from 'svelte/store';