TypeScript错误:属性“X”在类型“Window”上不存在

我已经添加了TS到我的React/Redux应用程序。

我在我的应用程序中像这样使用窗口对象:

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

TS抛出一个错误:

TypeScript错误:属性'FB'不存在类型'Window'。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属性在所有?

当前回答

有几种方法可以解决这个问题:

例如：

1-)做一个铸造:

(window as any).X

2)将以下代码放在react-app-env.d.ts文件中

interface Window {
  X?: {
    Y?: {
      .......
    }
  }
}

2021-09-07 02:49:13

其他回答

你可以很容易地解决这个问题，不需要任何声明

window["FB"]

更新因为它是一种不需要任何编译器配置来确保你的程序与typescript兼容的变通方法，所以你可能只需要一个类型验证。

if(window["FB"]) {
  // do some FB logic
}

2021-10-13 04:46:40

我在我的angular代码中遇到了这个问题。下面的解决方案帮助我解决了这个问题。

我通过在src内创建文件夹名称类型来解决这个错误，并在该文件夹内创建index.d.ts文件。

index.d.ts文件将有以下代码。

export {};
declare global {
  interface Window {
    chrome: any;  // this will be your variable name
  }
}

如果错误仍然存在，请尝试将types目录的路径添加到tsconfig中。json文件。

{
  "compilerOptions": {
    // ... rest
    "typeRoots": ["./node_modules/@types", "./src/types"]
  }
}

2022-03-30 10:40:51

有几种方法可以解决这个问题:

例如：

1-)做一个铸造:

(window as any).X

2)将以下代码放在react-app-env.d.ts文件中

interface Window {
  X?: {
    Y?: {
      .......
    }
  }
}

2021-09-07 02:49:13

我使用这个没有声明全局

declare const window: Window &
   typeof globalThis & {
     FB: any
   }

2021-07-26 13:00:27

更好的是

declare global {
  interface Window {
    FB: {
      CustomerChat: {
        hide: () => void;
        show: () => void;
      };
    };
  }
}

2021-10-13 06:11:56

TypeScript错误:属性“X”在类型“Window”上不存在

推荐文章

最新文章

标签