que - typescript tutorial español

Cómo sobrescribir la definición de tipo de TypeScript incorrecta instalada a través de @ tipos/paquete

Question

Digamos que quiero usar el módulo dotenv en mi proyecto de TypeScript e instalar su .d.ts usando npm install @types/dotenv --save . Entonces me doy cuenta de que los tipos no son correctos. Por ejemplo, la función config() no devuelve un valor booleano sino un objeto más rico.

¿Cómo trato con esta situación? ¿Debería copiar la definición de tipo descargada en otro archivo, actualizarla manualmente y desinstalar @ types / dotenv? ¿Hay alguna manera mejor? (Necesito la solución de inmediato, no después de que haya sido fusionada por los mantenedores ascendentes).

Answer 1

Copiaría los archivos de declaración de DefinitelyTyped, los modificaría localmente, enviaría un PR a DefinitelyTyped y luego seguiría los consejos sobre la siguiente pregunta para usar los cambios de inmediato: ¿Cómo puedo escribir y usar archivos de declaración personalizados que no existen en Definitivamente tipado?

Enviando actualizaciones a DefinitelyTyped

1. Dirígete al repositorio de DefinitelyTyped: https://github.com/DefinitelyTyped/DefinitelyTyped/
2. Clone su tenedor localmente. (a menudo solo git clone https://github.com/YourUserName/DefinitelyTyped/ )
3. Cree una rama para sus actualizaciones (por ejemplo, git branch changes-to-xyz )
4. Haz cambios en el paquete que te interesa.
5. Añadir y cometer archivos. ( git add types; git commit )
6. Luego, empújelos a su bifurcación de DefinitelyTyped ( git push -u origin changes-to-xyz )

Usando esas actualizaciones localmente

1. Cree una carpeta de local-types en su proyecto.
2. Copie la carpeta DefinitelyTyped (llamémosla xyz ) que modificó y en local-types/xyz .
3. Desde local-types/xyz , ejecute npm init --scope types --yes .
4. Desde la raíz de su proyecto, ejecute npm install local-types/xyz

¡Eso es!

Answer 2

Una forma que no se menciona aquí es colocar una declaración de tipo en un archivo index.d.ts . Para mi caso, los tipos de @types/react-bootstrap no fueron correctos.

Quería usar bsClass como se declara en la documentación, pero no existía en Popover . En su lugar, incluyeron una propuesta que no existe en Popover saber, bsStyle .

La solución para mí fue eliminar bsStyle y agregar bsClass :

// Overwrite bad declaration from @types/react-bootstrap
declare module "react-bootstrap" {
    namespace Popover {
        export interface PopoverProps extends React.HTMLProps<Popover> {
            // Optional
            arrowOffsetLeft?: number | string;
            arrowOffsetTop?: number | string;
            bsSize?: Sizes;
            bsClass?: string; // This is not included in types from @types/react-bootstrap
            placement?: string;
            positionLeft?: number | string;
            positionTop?: number | string;
        }
    }
    class Popover extends React.Component<Popover.PopoverProps> { }
}

Answer 3

Verificaría que la versión de dotenv y la versión de @types/dotenv estén alineadas, y que esta sea la causa de la función que falta.

Si lo son, entonces la forma más limpia sería modificar el .d.ts usted mismo. Para hacer esto: npm remove @types/dotenv . Crea una carpeta de types en tu proyecto. Copie toda la carpeta dotenv encuentra en los node_modules/@types en ella.

Luego arregla tus d.ts en él y modifica tu tsconfig.json para decirle que también busque en la nueva carpeta los tipos faltantes con typeRoots como este:

{
"compilerOptions": {
    "module": "commonjs",
    "noImplicitAny": true,
    "typeRoots": [
        "./node_modules/@types",
        "./types/",
    ]
},
"files": ["./app.ts"]
}

(No olvides agregar ./node_modules/@types u otros tipos que obtuviste con npm ya no se encontrarán)

¡Espero eso ayude!