TypeScript 错误：“窗口”类型上不存在属性“X”

Question

我已将 TS 添加到我的 React/Redux 应用程序中。

我在我的应用程序中使用 window 对象，如下所示：

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

TS 抛出错误：

TypeScript 错误：“窗口”类型上不存在属性“FB”。 TS2339

我想修复错误。

1（不起作用）

 // 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（修复错误）

我在这里找到了答案 https://stackoverflow.com/a/56402425/1114926

 declare const window: any;

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

为什么第一个版本不起作用，但第二个版本起作用，即使我根本没有指定 FB 属性？

原文由 Green 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

为什么 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') ）

原文由 Titian Cernicova-Dragomir 发布，翻译遵循 CC BY-SA 4.0 许可协议