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属性在所有?

当前回答

解决问题“属性不存在类型窗口在TypeScript”

步骤:1 .在src目录下，创建一个包含index.d.ts文件的types目录

export {};

declare global {
  interface Window {
    example: string; // whatever type you want to give. (any,number,float etc)
  }
}

步骤:2添加路径到你的类型目录到你的tsconfig。json文件。

tsconfig.json

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

3 .现在，无论你想在哪里使用它。

window.example = 'hello';

console.log(window.example);

2022-08-05 13:47:03

其他回答

更好的是

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

2021-10-13 06:11:56

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

window["FB"]

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

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

2021-10-13 04:46:40

对于任何来自Next.Js的人，你需要使用<Script />在<body>中加载它(在<Head />中加载它将不起作用):

https://nextjs.org/docs/basic-features/script

2022-10-11 18:10:10

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

例如：

1-)做一个铸造:

(window as any).X

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

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

2021-09-07 02:49:13

我在我的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

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

推荐文章

最新文章

标签