3

I have the following hierarchy

/
  /definitions
     window.d.ts
  /components
  ...
  tsconfig.json

With my window.d.ts being

export {}

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

And my tsconfig.json being

{
  "compilerOptions": {
    "outDir": "./dist",
    "allowJs": true,
    "target": "es5",
    "lib": ["es5", "es6"],
    "jsx": "react",
    "sourceMap": true,
    "module": "es6",
    "preserveConstEnums": true,
    "removeComments": true,
    "noImplicitAny": false,
    "moduleResolution": "node",
    "noUnusedParameters": false,
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "paths": {
      "window": ["definitions/window.d.ts"]
    }
  },
  "include": [
    "./App.tsx"
  ]
}

When I run dev-server, I get

[at-loader] Using typescript@2.6.1 from typescript and "tsconfig.json" from /correct/path/tp/tsconfig.json.

But when webpack finishes, I get 

ERROR in [at-loader] ./component/SomeApp.tsx:78:35
    TS2339: Property 'otherKey' does not exist on type 'Window'.

I have simply used window.otherKey without any other declare var window: any hoping that otherKey would just exist.

Why is this not working?

EDIT

I noticed this only happens for .tsx files. .ts files work fine ...

Kousha
  • 32,871
  • 51
  • 172
  • 296
  • Are you importing `window.d.ts` in `SomeApp.tsx`? Depending on your webpack configuration, that may help. – Matt McCutchen Aug 30 '18 at 13:42
  • I am not; I use `window` in many files, and I don't want to consistently re-import it. I want it to be part of the path. If I do import it, then yes it will work, – Kousha Aug 30 '18 at 17:20

1 Answers1

0

Found this answer here:

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

window.otherKey= window.otherKey|| {};
Cata John
  • 1,371
  • 11
  • 19