javascript - Kan inte exportera Interface i Typescript - den begärda modulen tillhandahåller inte en export med namnet Settings

Jag försöker exportera/importera ett interface i Typescript men jag får det här felet, jag är inte säker på vad jag gör fel här

Okänt Syntaxfel: Den begärda modulen '/src/types/settings.ts' tillhandahåller inte en export med namnet 'Settings'

I min types/settings.ts har jag detta

export interface Settings {
    activeUser: number
}

Och jag importerar det så här

import { Settings } from '@/types/settings'

Och här är min tsconfig.json

{
  "compilerOptions": {
    "target": "esnext",
    "baseUrl": "./src/",
    "useDefineForClassFields": true,
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "paths": {
      "@/*": ["src/*"],
    },
    "sourceMap": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "lib": ["esnext", "dom"],
    "isolatedModules": false
  },

  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
}

Jag använder Vue/Vite med Typescript

Svar #1

Troligtvis ett problem med att importera gränssnitt utan att uttryckligen markera dem som typ. Vite kräver att isolatedModules är sant, vilket i sin tur kräver att man hanterar gränssnitt på detta sätt:

interface IFoo { bar: string; }
export type { IFoo };

Tänk på att om du använder barrel-filer (index.ts) som ser ut så här:

export { IFoo } from './foo';

du bör konvertera dem så här istället:

export * from './foo';

eller så här

import type { IFoo } from "./foo";
export type { IFoo };

Ett annat smutsigt alternativ är att sätta skipLibCheck till true i tsconfig.json, vilket dock kommer att minska din typstrikthet.

Svar #2

Det är märkligt att npm run build fungerar bra, men npm run dev ger SyntaxError.

Jag var tvungen att använda import type { ... vilket i konsekvens också krävde samma behandling för Ref från vue.

En lösning publicerades på GitHub för Vite problem 731

Relaterade artiklar