Búsqueda de sitios web

typescript - ¿Cómo importar un tipo (de otro archivo) dentro de un archivo `d.ts` sin convertirlo en un módulo?


Me encontré con una situación extraña respecto a los archivos d.ts y los espacios de nombres.

Tengo algunos archivos d.ts donde declaro y fusiono un namespace llamado PROJECT.

Vea a continuación cómo se declara y se combina automáticamente (a través de múltiples archivos):

file1.d.ts ----- file2.d.ts ----- file3.d.ts

declare namespace PROJECT {

  interface SOME_INTERFACE {
    ...
  }

  type SOME_TYPE = SOME_UNION_TYPE

  // ETC
}

Ese espacio de nombres PROJECT es automáticamente accesible desde cada archivo de mi proyecto. Ejemplo:

SomeComponent.tsx

const someVariable: PROJECT.SOME_INTERFACE = { 
  // ... 
};

Este es todo un comportamiento esperado.

Mi problema comenzó cuando decidí declarar otro espacio de nombres.

ADMIN_BLOGPOST.d.ts

import type { ACTION_THUNK_GENERIC } from "@hooks/useReducerThunk";

declare namespace ADMIN_BLOGPOST {
  // HERE I DECLARE MULTIPLE TYPES
  // AND ONE OF THE TYPES USES THE `ACTION_THUNK_GENERIC` TYPE, WHICH IS BEING IMPORTED HERE

  type ACTION_THUNK = ACTION_THUNK_GENERIC<ACTION,GET_STATE>
}

Y solo por ese import type de nivel superior del ACTION_THUNK_GENERIC, ahora mi espacio de nombres ya no está disponible automáticamente.

VSCode comenzó a considerar ADMIN_BLOGPOST.d.ts como un módulo y empezó a hacer que tuviera que import ese espacio de nombres antes de usarlo, así:

SomeComponent.tsx

import type { ADMIN_BLOGPOST } from "@src/types/ADMIN_BLOGPOST";

const someVariable: ADMIN_BLOGPOST.ACTION_THUNK

Tenga en cuenta que si elimino esa importación de nivel superior (la que importa ACTION_THUNK_GENERIC) del archivo ADMIN_BLOGPOST.d.ts, entonces mi espacio de nombres ADMIN_BLOGPOST se vuelve disponible sin necesidad de importarlo primero.

Pero realmente necesito esa importación. Porque necesito el tipo ACTION_THUNK_GENERIC para poder construir el tipo no genérico ACTION_THUNK.

¿Hay una manera diferente de hacer esto para que mi espacio de nombres ADMIN_BLOGPOST esté disponible sin tener que importarlo antes de usarlo? Es decir: ¿Cómo importar dentro de un archivo d.ts sin convertirlo en un módulo?

Respuesta #1

Usa declare global para trabajar en un espacio de nombres global independientemente de las importaciones de módulos. Por ejemplo:

import type { ACTION_THUNK_GENERIC } from "@hooks/useReducerThunk";
declare global {
  declare namespace ADMIN_BLOGPOST {
    type ACTION_THUNK = ACTION_THUNK_GENERIC<ACTION,GET_STATE>
  }
}

Alternativamente, puedes usar una importación dinámica:

declare namespace ADMIN_BLOGPOST {
  type ACTION_THUNK = import("@hooks/useReducerThunk").ACTION_THUNK_GENERIC<ACTION,GET_STATE>
}