How to define browserHistory on the window object with typescript

Question

I am new to typescript and am having a hard figuring out how to define browserHistory on the window object. I am using the history package from ReactTraining.

In my app.jsx I have:

import { createBrowserHistory } from 'history';

const history = createBrowserHistory({
  basename: basePath,
});

window.browserHistory = history;

Then in my modules.d.ts I have this code which is not working:

import { History } from '@types/history';
interface Window { browserHistory: History; }

Anywhere is my app that I am using window.browserHistory I get the error:

TS2339: Property 'browserHistory' does not exist on type 'Window'.

I can get this error to go away but replacing History with any but that seems like an incorrect approach. The npm package @types/history doesn't seem to have a clear example.

Possible duplicate of [How do you explicitly set a new property on \`window\` in TypeScript?](https://stackoverflow.com/questions/12709074/how-do-you-explicitly-set-a-new-property-on-window-in-typescript) — Austaras, Apr 29 '19 at 21:34

score 0 · Answer 1 · answered Apr 30 '19 at 16:37

0

This was the proper syntax

import { History } from 'history';

declare global {
    interface Window { browserHistory: History; }
}

answered Apr 30 '19 at 16:37

Phil Mok

3,860
6
24
36

How to define browserHistory on the window object with typescript

1 Answers1