在SvelteKit导入TypeScript接口?

Question

我有一个开始的SvelteKit项目。我正在尝试在多个地方重用一个接口。

文件放在/src/lib/choice.ts.

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

但是，当我尝试在Svelte组件中引用此接口时，如下所示:

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

我得到这个错误:

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'

我的IDE，然而，认为这是完全有效的，直到并包括允许点击导航到选择声明。

但是，如果我将声明更改为:

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

一切正常，我的IDE很高兴。

这是怎么回事?我不明白为什么接口不能工作，但是类声明可以。

Answer 1

您可能需要将其注释为类型导入:

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

如果您查看SvelteKit的默认tsconfig.json，有一个解释:

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