javascript - ¿La mejor manera de compartir tipos en un gran proyecto de TypeScript?

Estoy trabajando en una aplicación grande de React escrita en TypeScript. Tengo muchos tipos comunes declarados en archivos separados, y cada vez que necesito un tipo lo importo. Funciona bien, pero crea montones de importaciones diferentes, lo que definitivamente no me gusta.

Otra opción sería usar archivos .d.ts para declarar tipos globalmente y poder usar tipos sin importarlos explícitamente. ¿Se considera esto una mejor práctica o debería seguir usando las importaciones?

Respuesta #1

Creo que un enfoque de sentido común para esto es lo mejor. Por ejemplo, estamos trabajando en una gran aplicación de React en este momento, usando un monorepo, con un repositorio compartido para componentes compartidos. Así que tenemos reglas sobre cosas como declaraciones y componentes:

• si usas un tipo/interfaz en más de un lugar, va al archivo ~shared/lib/types.ts
• si tienes un componente que se usa en más de un lugar, se refactoriza a la carpeta ~shared/components
• si extiendes un tipo/interfaz, puede ser declarado localmente, pero mientras no se use más de una vez

Una vez que las personas se acostumbran a estas reglas simples, comienza a hacer que el trabajo de desarrollo sea mucho más fácil. Los desarrolladores se acostumbran a refactorizar cuando lo necesitan, pero también a pensar en cómo programan.

Respuesta #2

1. Coloca todas las declaraciones compartidas en un archivo, digamos index.d.ts.

2. Pon este archivo en una carpeta, digamos /src/typings

3. En tsconfig.json, actualiza el siguiente campo:

   {.   
      "compilerOptions": {.  
          "typeRoots": ["./node_modules/@types", "./src/typings"].  
      }.  
   }.  
   

Ahora los tipos estarán disponibles en todos los archivos.