0
217
VistasLos tipos de biblioteca no se reflejan correctamente en el archivo JS
Estoy importando un archivo JS simple a través de una etiqueta de secuencia de script en una página HTML.
Como uso jQuery en el sitio web, agregué // @ts-check en la parte superior del archivo JS, así como los tipos de jQuery:
/** * Modal Functionality * @param {JQueryStatic} $ Provides jQuery types */ const example = ($) => ... Si bien los tipos de jQuery se convierten correctamente en $ , también estoy usando la biblioteca Swiper e incluyo el JS de la biblioteca a través de otra etiqueta de secuencia de comandos. En aras del argumento, esta podría ser cualquier otra biblioteca importada externamente.
Cuando se usa new Swiper('...') en el JS, TS garabatea líneas debajo de Swiper: Cannot find name 'Swiper' . He agregado el siguiente código a un archivo TS adyacente:
declare global { interface Window { Swiper: typeof import('swiper'); // swiper types imported from official package } } let Swiper = window.Swiper; Volviendo a mi archivo JS, al pasar el mouse sobre Swiper todavía se lee Swiper: any . ¿No debería reflejar los tipos encontrados en el paquete importado? ¿Es la estructura de archivos JS/TS un problema? ¿Cómo obtengo anotaciones de tipo en un archivo JS?
1 Respuestas
Responde la pregunta0
Algunas bibliotecas incluyen tipos, otras no. Necesitas instalar tipos para Swiper.
npm install --save-dev @types/swiperDespués de esto, puede importar el tipo en el archivo ts
// index.d.ts import Swiper from 'swiper'; declare global { interface Window { Swiper: Swiper; } } 
[Actualización 1]
Typescript mira la declaración de tipo global de forma predeterminada en el archivo index.d.ts. Para declarar módulos o ampliar ventanas y propiedades globales, debe declararlos en index.d.ts .
Cómo resolver su problema:
- Cree el archivo index.d.ts en la raíz del proyecto (si no tiene el archivo tsconfig.json).
- Declare Swiper como se muestra arriba.