webpack - ¿Cómo se pueden crear e importar módulos ambientales hechos por uno mismo en TypeScript?

Tengo una biblioteca de JavaScript externa que crea un objeto global en window. Para usar este objeto en código TypeScript, he creado un archivo de módulo ambiental (d.ts) que se importa dentro de otro archivo TypeScript.

El problema que estoy enfrentando es que el compilador dice que el archivo del módulo no es un módulo

src/App.ts(6,22): error TS2306: File '/Users/user/ts-problems/src/abc.d.ts' is not a module.

También estoy usando webpack con ts-loader, pero compilarlo solo con (tsc) me da el mismo resultado.

Este es el archivo de módulo ambiental abc.d.ts

declare module "abc" {
    export interface Greeter {
        sayHello(): void;
    }
    export var abc: Greeter;
}

Y este es el archivo App.ts:

import * as abc from "./abc";


class App {
    static sayGoodbye() {
        console.log("goodbye from App.ts");
    }
}

abc.abc.sayHello();
App.sayGoodbye();

El proyecto de prueba está disponible en https://github.com/daneilsan/ts-module-problem

Cualquier ayuda sería muy apreciada porque no sé qué más hacer

Respuesta #1

El archivo abc.d.ts no tiene ninguna declaración export o import en el nivel superior, por lo que no es un módulo y no se puede usar con importación relativa. Es decir,

import ...some stuff... from "./abc";

falla.

Sin embargo, no hay files, include o exclude presentes en tu tsconfig.json, por lo que por defecto, cualquier archivo con extensión *.ts o *.d.ts se incluye en la compilación.

Eso significa que abc.d.ts está incluido, por lo que no hay necesidad de ///referencearlo, y todas las declaraciones dentro de él son vistas por el compilador, en particular esta:

declare module "abc" {
    ... stuff exported here
}

Eso significa que puedes usar esta importación

import * as abc from "abc";

para importar cosas. Estará disponible como abc.Greeter y abc.abc.

Este formulario

import {Greeter, abc} from "abc";

también funciona, haciendo que Greeter y abc estén disponibles directamente y no como propiedades del ámbito de abc.

En resumen: para que las cosas funcionen, el nombre del módulo en la declaración import debe escribirse exactamente de la misma manera que en la declaración declare module ("abc"), y el archivo que contiene declare module debe estar incluido en la compilación (ya está hecho por defecto con tu tscontig).