javascript - Typescript kann den Namen window oder document nicht finden

Für jeden Fall:

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

Ich erhalte Fehler TS2304: Name 'window' kann nicht gefunden werden.

Fehlt mir etwas in tsconfig.json für eine Definitionsdatei, die ich installieren sollte?

Ich erhalte die Nachricht beim Ausführen von tsc und in 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"
    ]
}

Meine Antwort: Für die Verwendung mit tsconfig.json ziele ich auf es5 und verwende lib: ["es2015", "dom"]

Antwort #1

benutzen

"lib": ["dom"]

in tsconfig.json

z. B.

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

Antwort #2

Es scheint, dass das Problem dadurch verursacht wird, dass ES2016 angesteuert wird.
Zielst du das aus einem bestimmten Grund an? Wenn du es6 ansteuerst, wird der Fehler wahrscheinlich verschwinden.

Eine weitere Möglichkeit besteht darin, die Bibliotheken anzugeben, die der Compiler verwenden soll:

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

Was den Fehler ebenfalls verschwinden lassen sollte.

Ich bin mir nicht sicher, warum die Bibliotheken nicht standardmäßig verwendet werden. In der Dokumentation zu den Compiler-Optionen steht zur --lib-Option:

Hinweis: Wenn --lib nicht angegeben ist, wird eine Standardbibliothek eingefügt. Die eingefügte Standardbibliothek ist:
► Für --target ES5: DOM, ES5, ScriptHost
► Für --target ES6: DOM, ES6, DOM.Iterable, ScriptHost

Aber es wird nicht angegeben, welche die Standardbibliotheken beim Ziel ES2016 sind.
Es könnte ein Fehler sein, versuche, ein Problem zu öffnen, wenn du es tust, bitte teile den Link hier.

Antwort #3

Wenn Sie bun anstelle von node verwenden, müssen Sie bun add @types/web -D verwenden.

Das Problem wird unter https://github.com/oven-sh/bun/issues/3030 erklärt

Lösung

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

Hinweis: Das Hinzufügen der Typen-Referenz zu Ihrer tsconfig.json, wie im GitHub-Issue erklärt, scheint nicht zwingend erforderlich zu sein. Es scheint auszureichen, nur die Abhängigkeit zu installieren, um den Fehler zu beheben.

Antwort #4

Update: Um zu vermeiden, diese Referenzen zu jeder Datei hinzufügen zu müssen, siehe stackoverflow.com/a/77103144

Ich habe Bun verwendet und das Hinzufügen der folgenden Dreifach-Slash-Direktiven am Anfang der entsprechenden TypeScript-Datei hat es gelöst:

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

Das liegt daran, dass das Setzen von "types": ["bun-types"] bedeutet, dass TypeScript andere globale Typdefinitionen, einschließlich lib: ["dom"], ignoriert.

Dasselbe gilt für andere globale Typdefinitionsbibliotheken wie webworker.