svelte - ¿Importar interfaces de TypeScript en SvelteKit?

Tengo un proyecto inicial de SvelteKit. Estoy tratando de reutilizar una interfaz en varios lugares.

El archivo está ubicado en /src/lib/choice.ts.

export interface Choice {
    id: number;
    value: string;
}

Sin embargo, cuando intento referenciar esta interfaz en un componente de Svelte de la siguiente manera:

<script lang="ts">
    import {Choice} from "$lib/choice";
</script>

Obtengo este error:

500
The requested module '/src/lib/choice.ts' does not provide an export named 'Choice'
SyntaxError: The requested module '/src/lib/choice.ts' does not provide an export named 'Choice'

Sin embargo, mi IDE cree que esto es perfectamente válido, incluso hasta permitir la navegación por clic a la declaración de Choice.

Sin embargo, si cambio la declaración a esto:

export class Choice {
    id!: number;
    value!: string;
}

Todo funciona y mi IDE está contento.

¿Qué está pasando aquí? No entiendo por qué la interfaz no funciona pero la declaración de la clase sí.

Respuesta #1

Es posible que tengas que anotar esto como una importación de tipo:

import type { Choice } from "$lib/choice";

Si miras el tsconfig.json predeterminado de SvelteKit, hay una explicación:

{
  "compilerOptions": {
    // this ensures that types are explicitly
    // imported with `import type`, which is
    // necessary as svelte-preprocess cannot
    // otherwise compile components correctly
    "importsNotUsedAsValues": "error",