web-dev-qa-db-ja.com

TypeScriptエラー：プロパティ 'X'がタイプ 'Window'に存在しません

TSをReact/Reduxアプリに追加しました。

私はアプリでwindowオブジェクトを次のように使用します：

componentDidMount() {
  let FB = window.FB;
}

TSはエラーをスローします。

TypeScriptエラー：プロパティ 'FB'がタイプ 'Window'に存在しません。 TS2339

エラーを修正したい。

1 (doesn't work)

// Why doesn't this work? I have defined a type locally

type Window = {
  FB: any
}

componentDidMount() {
  let FB = window.FB;
}

// TypeScript error: Property 'FB' does not exist on type 'Window'. TS2339

2 (fixes the error)

私はここで答えを見つけました https://stackoverflow.com/a/56402425/1114926

declare const window: any;

componentDidMount() {
  let FB = window.FB;
}
// No errors, works well

FBプロパティをまったく指定していなくても、なぜ最初のバージョンは機能しませんが、2番目のバージョンは機能しますか？

reactjstypescriptcreate-react-app
13
Green

_declare const window: any;_を使用する理由

タイプanyのローカル変数を宣言するからです。タイプanyを使用すると、本質的にwindowのタイプチェックがオフになるため、それを使用して何でも実行できます。私はこのソリューションをお勧めしません、それは本当に悪いものです。

なぜ_type Window = { FB: any }_が機能しないのですか？タイプWindowを定義します。このタイプは、モジュールで定義されている場合、グローバルwindowオブジェクトのタイプとは関係なく、たまたまモジュール内でWindowと呼ばれるだけのタイプです。

良い解決策windowを拡張するには、グローバルWindowインターフェースを拡張する必要があります。これは次のようにして行うことができます：

_declare global {
    interface Window {
        FB:any;
    }
}

let FB = window.FB; // ok now
_

この拡張機能は、定義したファイルだけでなく、プロジェクト全体で使用できることに注意してください。また、FBに定義がある場合は、少しよく入力することを検討してください（FB: typeof import('FBOrWhateverModuleNameThisHas')）

24
Titian Cernicova-Dragomir