CODEWITHSUNDEEP
reactjstypescriptelectron
Raphael10
Raphael10

Reputation: 3114

Property does not exist on type Window & typeof globalThis

In a Electron-React-Typescript app I'm getting this error: Property 'api' does not exist on type 'Window & typeof globalThis'. window.api.send('open-type-A-window', '');

But in a file index.d.ts I declared interface Window in this way:

declare global {
  namespace NodeJS {
    declare interface Window {
      "electron": {
          openNewWindow(): void;
      },
      "api": {
          send: (channel, data) => {
              ipcRenderer.invoke(channel, data).catch(e => console.log(e))
          },
          receive: (channel, func) => {
            console.log("preload-receive called. args: ");
            ipcRenderer.on(channel, (event, ...args) => func(...args));
          },
          electronIpcSendTo: (window_id: string, channel: string, ...arg: any) => {
            ipcRenderer.sendTo(window_id, channel, arg);
          },
          electronIpcSend: (channel: string, ...arg: any) => {
            ipcRenderer.send(channel, arg);
          },
          electronIpcSendSync: (channel: string, ...arg: any) => {
            return ipcRenderer.sendSync(channel, arg);
          },
          electronIpcOn: (channel: string, listener: (event: any, ...arg: any) => void) => {
            ipcRenderer.on(channel, listener);
          },
          electronIpcOnce: (channel: string, listener: (event: any, ...arg: any) => void) =>
 {
            ipcRenderer.once(channel, listener);
          },
          electronIpcRemoveListener:  (channel: string, listener: (event: any, ...arg: any) 
=> void) => {
            ipcRenderer.removeListener(channel, listener);
          },
          electronIpcRemoveAllListeners: (channel: string) => {
            ipcRenderer.removeAllListeners(channel);
          }
      }
    }
  }
}

I've read this thread: https://github.com/Microsoft/TypeScript/issues/19816 but I didn't get the proper solution.

What should I add / modify in order to avoid this error Property 'api' does not exist on type 'Window & typeof globalThis' ?

Upvotes: 16

Views: 57753

Answers (1)

Richard Chapman Gomez
Richard Chapman Gomez

Reputation: 546

I'm not familiar with React.js but I had the same issue with an Electron-Angular application. By adding the following declaration to my app.module.ts file it allows TypeScript to recognize the api object in window.

You should be able to do the same by adding to your main module in your TS project.

declare global {
  interface Window {
    api?: any;
  }
}

After you should be able to simple execute your code anywhere in your project.

if(window.api) {
  window.api.send('ipcChannel', data);
}

Upvotes: 52

Related Questions