javascript - Typescript no puede encontrar el nombre window o document

Para cualquier caso:

document.getElementById('body');
// or
window.document.getElementById('body');

Recibo error TS2304: No se puede encontrar el nombre 'window'.

¿Me está faltando algo en tsconfig.json para un archivo de definición que debería instalar?

Recibo el mensaje al ejecutar tsc y en vscode

tsconfig.json:

{
    "compilerOptions": {
        "allowJs": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "jsx": "react",
        "module": "commonjs",
        "moduleResolution": "node",
        "noEmitOnError": true,
        "noImplicitAny": false,
        "sourceMap": true,
        "suppressImplicitAnyIndexErrors": true,
        "target": "ES2016",
        "typeRoots": [
            "node_modules/@types/",
            "typings/index.d.ts"
        ]
    },
    "exclude": [
        "node_modules",
        "**/*-aot.ts"
    ]
}

Mi respuesta: Para usar con tsconfig.json apunto a es5 y uso lib: ["es2015", "dom"]

Respuesta #1

usar

"lib": ["dom"]

en tsconfig.json

p. ej.

{
  "compilerOptions": {
    "lib": ["es5", "es6", "dom"],
    "outDir": "./dist/",
    "sourceMap": true,
    "noImplicitAny": true,
    "module": "commonjs",
    "target": "es6",
    "moduleResolution": "node",
    "jsx": "react"
  },
  "include": ["./src/**/*"]
}

Respuesta #2

Parece que el problema es causado por apuntar a ES2016.
¿Apuntas a eso por alguna razón? Si apuntas a es6, probablemente el error desaparecerá.

Otra opción es especificar las bibliotecas que el compilador debe usar:

tsc -t ES2016 --lib "ES2016","DOM" ./your_file.ts

Lo cual también debería hacer que el error desaparezca.

No estoy seguro de por qué las bibliotecas no se usan por defecto, en la documentación de las opciones del compilador se indica para la opción --lib:

Nota: Si no se especifica --lib, se inyecta una biblioteca predeterminada. La biblioteca predeterminada inyectada es:
► Para --target ES5: DOM,ES5,ScriptHost
► Para --target ES6: DOM,ES6,DOM.Iterable,ScriptHost

Pero no indica cuáles son las bibliotecas predeterminadas al apuntar a ES2016.
Podría ser un error, intenta abrir un problema, si lo haces por favor comparte el enlace aquí.

Respuesta #3

Si estás usando bun en lugar de node, entonces necesitas usar bun add @types/web -D.

El problema está explicado en https://github.com/oven-sh/bun/issues/3030

Solución

https://github.com/oven-sh/bun/issues/463#issuecomment-1636727109

Nota: Agregar la referencia de tipos a tu tsconfig.json, como se explica en el problema de GitHub, parece no ser obligatorio. Solo instalar la dependencia parece suficiente para eliminar el error.

Respuesta #4

Actualización: Para evitar tener que agregar estas referencias en cada archivo, consulta stackoverflow.com/a/77103144

Estaba usando bun, y agregar las siguientes directivas de triple barra al principio del archivo TypeScript relevante lo solucionó:

/// <reference lib="dom" />
/// <reference lib="dom.iterable" />

Esto se debe a que establecer "types": ["bun-types"] significa que TypeScript ignorará otras definiciones de tipos globales, incluyendo lib: ["dom"].

Lo mismo se aplica a otras bibliotecas de definición de tipos globales como webworker.