Búsqueda de sitios web

¿Cómo agrupar muchos archivos de declaración de TypeScript en un paquete npm e importar desde index.d.ts?

Tengo un paquete interno con más o menos la siguiente estructura:

myPackage/
|- types/
|  |- type1.d.ts
|  |- type2.d.ts
|- src/
|  |- someUtilities.ts
|- index.ts
|- package.json
|- tsconfig.json

El index.ts está importando y exportando todos los archivos .d.ts en ./types y todos los archivos .ts en ./src. Lo transpilo con tsc y copio todos los archivos de declaración en la compilación y obtengo esta estructura.

myPackage/
|- types/
|  |- type1.d.ts
|  |- type2.d.ts
|- src/
|  |- someUtilities.ts
|- index.d.ts
|- index.js
|- package.json

El index.d.ts tiene correctamente todas las importaciones y exportaciones de tipos tal como se espera y el index.js tiene la versión transpilada de todo lo que tengo en el src. Hasta ahora todo bien.

Tengo otro proyecto (CRA) donde quiero usar este paquete interno. Empaqueto myPackage y luego en ese otro proyecto lo pongo en package.json con

dependencies: {
  "myPackage": "file:pathToMyPackage.tgz"
}

Durante el desarrollo, VSCode encuentra correctamente todos los tipos y funciones del paquete. Sin embargo, cuando ejecuto npm run build, que simplemente ejecuta react-scripts build, recibo un error Module not found: Can't resolve './types/type1.d.ts' in '/node_modules/myPackage.

Si creo un archivo de índice en el directorio types y lo señalo como mis tipos en package.json, el proceso de compilación encontrará esos tipos, pero obviamente no puede encontrar los tipos transpilados de los archivos src.

myPackage/
|- types/
|  |- type1.d.ts
|  |- type2.d.ts
|  |- index.d.ts <- this one importing those above and works in when using as dep in other projects
|- src/
|  |- someUtilities.ts
|- index.d.ts <- this isn't found because package.json points to types/index.d.ts as types
|- index.js
|- package.json

Luego intenté usar un solo índice en la raíz del paquete y usé esas directivas de triple barra para apuntar a los tipos. Eso funciona en parte, pero luego en otros proyectos tengo que usar la ruta completa a cierto tipo al importarlo

// index.ts at package root
/// <reference path="./types/type1.d.ts">
/// <reference path="./types/type1.d.ts">
import { someUtility } from './src/someUtilities'
export { someUtility }

// Doesn't work
import { someType } from 'myPackage'

// Works
import { someType } from 'myPackage/path/to/the/type/file'

¿Es posible separar todos los tipos en sus propios archivos y agruparlos de alguna manera, para que puedan ser importados desde el índice o necesito unirlos manualmente en un enorme archivo index.d.ts y usarlos directamente desde ahí? No me gustaría hacer eso, porque ese archivo de declaración de índice sería enorme y difícil de manejar. Tengo múltiples archivos de declaración bajo el directorio types y cada uno de ellos es su propio espacio de nombres.

Respuesta #1

Me di cuenta de que, para tener todos los archivos .ts y .d.ts en un solo punto de entrada, los tipos .d.ts necesitan ser importados como import { type someType } from './types/type1.d.ts'

Entonces el archivo index.ts en la raíz podría ser algo así:

export { utility } from './src/someUtilities'
export { type someType } from './types/type1'

Ahora, cuando eso se transpila, todas las importaciones y exportaciones están correctamente en el archivo index.d.ts generado en la raíz. Por supuesto, los archivos .d.ts que hayas creado fuera del proceso de transpile necesitan ser copiados en la carpeta de tipos.

Artículos relacionados