如何在TypeScript中的`window`中显式设置一个新的属性？

我通过在window上显式设置属性来为我的对象设置全局命名空间。

 window.MyNamespace = window.MyNamespace || {}; 

TypeScript强调MyNamespace并抱怨说：

属性'MyNamespace'不存在于'window'types的值上任何“

我可以通过将MyNamespace声明为环境variables并删除window显式来使代码工作，但我不想这样做。

 declare var MyNamespace: any; MyNamespace = MyNamespace || {}; 

我怎样才能保持window ，使TypeScript快乐？

作为一个方面的说明，我觉得特别有趣的是TypeScript抱怨，因为它告诉我， window是anytypes的，肯定可以包含任何东西。

Answer 1

要保持dynamic，只需使用：

 (<any>window).MyNamespace 

Answer 2

刚刚在另一个StackOverflow问题的答案中find了答案 。

 declare global { interface Window { MyNamespace: any; } } window.MyNamespace = window.MyNamespace || {}; 

基本上你需要扩展现有的window界面来告诉它你的新属性。

Answer 3

要么…

你可以input：

 window['MyNamespace'] 

你不会得到一个编译错误，它和inputwindow.MyNamespace

Answer 4

使用TSX？ 没有其他答案为我工作。

以下是我所做的：

 (window as any).MyNamespace 

Answer 5

接受的答案是我曾经使用的，但与TypeScript 0.9。*它不再起作用。 Window界面的新定义似乎完全取代了内置的定义，而不是增强它。

我已经采取了这样做：

 interface MyWindow extends Window { myFunction(): void; } declare var window: MyWindow; 

更新：与TypeScript 0.9.5接受的答案是再次工作。

Answer 6

如果需要使用需要使用import的自定义types来扩展window对象，则可以使用以下方法：

window.d.ts

 import MyInterface from './MyInterface'; declare global { interface Window { propName: MyInterface } } 

请参阅手册“声明合并”一节中的“全局扩充”： https ： //www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation

Answer 7

如果您使用的是TypeScript定义pipe理器，请按照以下步骤操作 ！

 npm install typings --global 

创buildtypestypings/custom/window.d.ts ：

 interface Window { MyNamespace: any; } declare var window: Window; 

安装您的自定义input：

 typings install file:typings/custom/window.d.ts --save --global 

完成，使用它！ 打字稿不会再抱怨了：

 window.MyNamespace = window.MyNamespace || {}; 

Answer 8

全球是“邪恶”:)，我认为最好的方式也有便携性是：

• 首先导出界面：（例如：./custom.window.ts）

  export interface CustomWindow extends Window { customAttribute: any; }

• 第二你import

  import {CustomWindow} from './custom.window.ts';

• 第三个用CustomWindow投射全局variables窗口

  declare let window: CustomWindow;

这样，如果你使用窗口对象的已有属性，那么在不同的IDE中也不会有红线，所以最后试试：

 window.customAttribute = 'works'; window.location.href = '/works'; 

使用Typescript 2.4.x进行testing

Answer 9

如果您使用的是Angular CLI，那么它非常简单（在CLI RC.0上testing）：

SRC / polyfills.ts

 declare global { interface Window { myCustomFn: () => void; } } 

我定制，utils.ts

 window.myCustomFn = function () { ... }; 

我正在使用IntelliJ，所以我还需要在IDE中更改以下设置，然后再拾取新的polyfills：

 > File > Settings > Languages & Frameworks > TypeScript > check 'Use TypeScript Service'. 

Answer 10

大多数其他答案并不完美。

• 他们中的一些只是压制店铺的types推断。
• 其他一些只关心全局variables作为命名空间，而不是作为接口/类

今天早上我也遇到类似的问题。 我在SO上试了这么多的“解决scheme”，但是没有一个绝对没有产生types错误，并且在IDE（webstorm或者vscode）中启用触发types跳转。

最后，从这里

https://github.com/Microsoft/TypeScript/issues/3180#issuecomment-102523512

，我find一个合理的解决scheme来附加types作为接口/类和命名空间的全局variables的types 。

示例如下：

 // typings.d.ts declare interface Window { myNamespace?: MyNamespace & typeof MyNamespace } declare interface MyNamespace { somemethod?() } declare namespace MyNamespace { // ... } 

现在，上面的代码将名称空间MyNamespace和接口MyNamespace合并到全局variablesmyNamespace （window属性）中。

Answer 11

当我尝试这个， window被键入到Window – 这意味着有一个定义，指出一个Window可以支持的属性和方法，而您的自定义名称空间不在该列表中。

你不能使用TypeScript模块得到你想要的行为吗？

 module MyNamespace { export class Example { } } 

Answer 12

供参考（这是正确的答案）：

在.d.ts定义文件中

 type MyGlobalFunctionType = (name: string) => void 

如果您在浏览器中工作，则可以通过重新打开Window的界面将成员添加到浏览器的窗口上下文中：

 interface Window { myGlobalFunction: MyGlobalFunctionType } 

NodeJS的想法相同：

 declare module NodeJS { interface Global { myGlobalFunction: MyGlobalFunctionType } } 

现在你声明了根variables（这实际上将生活在窗口或全局）

 declare const myGlobalFunction: MyGlobalFunctionType; 

然后在一个常规的.ts文件中，但是作为副作用导入，你实际上实现了它：

 global/* or window */.myGlobalFunction = function (name: string) { console.log("Hey !", name); }; 

最后在代码库的其他地方使用它：

 global/* or window */.myGlobalFunction("Kevin"); myGlobalFunction("Kevin"); 

Answer 13

find答案后，我认为这个页面可能会有所帮助。 https://www.typescriptlang.org/docs/handbook/declaration-merging.html#global-augmentation不知道声明合并的历史，但它解释了为什么以下可以工作。;

 interface Window { MyNamespace: any; }