Búsqueda de sitios web

exportar tipo de TypeScript en archivo Svelte


Quiero exportar el tipo que definí en uno de mis archivos e importarlo dentro de otro archivo.

export type myNewType = {name: string};

el linter me muestra el siguiente error cuando agrego export:

Modifiers cannot appear here.

Puedo hacerlo funcionar creando un nuevo archivo ts e importando el tipo desde él. Solo quiero saber si hay una manera de definir un tipo dentro de un archivo svelte o no.

Actualización:

Uso la plantilla de Sapper y se ejecutará sin errores, pero la funcionalidad de TS no funciona y me muestra errores en vscode al importar type y export type desde un archivo svelte.

Respuesta #1

Necesitas exportar el tipo desde un script de módulo, no desde el script normal. También necesitas agregar el atributo lang="ts" ya sea en el script normal o en el script de módulo. Esto funcionará:

Svelte 3 y 4:

<script context="module" lang="ts">
  export type myNewType = {name: string};
</script>

<script>
  export let aProp: string;
</script>

<p>some html</p>

Svelte 5+

<script module lang="ts">
  export type myNewType = {name: string};
</script>

<script>
  let { aProp }: { aProp: string } = $props();
</script>

<p>some html</p>

En general, siempre que quieras importar algo de otro archivo Svelte que no sea el propio componente, necesitas declarar esa exportación dentro del script de módulo.

Respuesta #2

Por si le sirve a alguien, estaba teniendo un problema al importar mi propio tipo, que había declarado en un archivo .ts, en otro archivo de la biblioteca:

Mi tipo fue declarado de la siguiente manera:

export type UserAuth = {
    name: string,
    email: string,
    token: ''
};

En mi archivo /lib/auth.ts, estaba intentando importarlo de la siguiente manera:

import { UserAuth } from "../types/user.auth";

Lo que produjo un error indicando que el tipo no ha sido exportado.

Lo siguiente solucionó el problema para mí:

import type { UserAuth } from "../types/user.auth";

Artículos relacionados