Extending Window: types vs interfaces

I wanted to add a property to the Window object and use it in my React app, but TypeScript kept complaining it wasn't defined—even though I had it in global.d.ts.

Because of the @typescript-eslint/consistent-type-definitions rule, I was using:

type Window = {
  dataLayer: Record<string, unknown>;
}

Turns out, type doesn't support augmentation. It’s only useful when you want to explicitly declare all properties. But interface does support augmentation, which is exactly what we need here:

interface Window {
  dataLayer: Record<string, unknown>;
}

In general, I prefer type for app code since it avoids hidden extensions. But if you're extending built-in or third-party types, interface is the way to go.

For documentations, you can check our declaration merging on TS lang website.

• 26-03-2025

  tsx doesn’t support decorators

• 30-05-2024

  Next.js Hydration Window Issue

• 29-11-2024

  React Component Lifecycle

• 09-03-2024

  Combining RxJS observables - Part 1

• 11-03-2024

  My go-to Next.js ESlint config