TypeScript error: Property 'X' does not exist on type 'Window'

Solution 1:

Why does declare const window: any; work?

Because you declare a local variable of type any. Having something of type any essentially turns off type checking for window so you can do anything with it. I really do not recommend this solution, it is a really bad one.

Why doesn't type Window = { FB: any } work? You define a type Window. This type if defined in a module has nothing to do with the type of the global window object, it is just a type that happens to be called Window inside your module.

The good solution To extend window you must extend the global Window interface. You can do this like this:

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

let FB = window.FB; // ok now

Note that this extension is going to be available in your whole project not just the file you define it in. Also if FB has definitions you might consider typing it a bit better (FB: typeof import('FBOrWhateverModuleNameThisHas'))

Solution 2:

There are a few ways to solve this problem:

Somethings exemples:

1-) Do it a cast:

(window as any).X

2-) Put the follow code in file react-app-env.d.ts

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

}

Solution 3:

you can solve the problem easily without any need to declaration

window["FB"]

Solution 4:

I use this without declare global

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

Solution 5:

better still

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