扩展 Typescript 中的内置类型

Zol*_*ete 4 javascript typescript webdriver-io ts-node typescript3.0

我有以下结构:

project
 |- types
    |- global.d.ts
    |- string.d.ts
    |- wdio.d.ts
 |- src
    |- Models
    |- Resources
    |- Components
    |- Extensions
       |- string.ts
    |- ...
 |- tsconfig.json
 |- wdio.conf.js
Run Code Online (Sandbox Code Playgroud)

我尝试用函数扩展字符串的原型。到目前为止我尝试了很多方法,我在几个网站上找到了。但要么tsc给我错误,要么 PHPStorm 显示错误消息。

project
 |- types
    |- global.d.ts
    |- string.d.ts
    |- wdio.d.ts
 |- src
    |- Models
    |- Resources
    |- Components
    |- Extensions
       |- string.ts
    |- ...
 |- tsconfig.json
 |- wdio.conf.js
Run Code Online (Sandbox Code Playgroud)

我将类的增强添加String到 d.ts 文件中。然后我在一个单独的文件中定义函数的主体。当我在文件中实现它时src/Extensions/string.ts,该tsc命令没有给出错误消息,但 PHPStorm 显示以下错误:

TS2339: Property 'myCustomFn' does not exist on type 'String'.

而且,代码中的任何位置自动完成都会显示我的方法,甚至代码可以执行,并使用该myCustomFn函数。

问题:

  • 这只是IDE的错误吗?
  • 我是否做错了什么,或者 String 类的扩展方式应该以不同的方式进行?

a13*_*300 7

Github上的完整工作示例

将您的String界面扩展放入随机.d.ts文件中:

interface String {
  myCustomFn(text : string) : string;
}
Run Code Online (Sandbox Code Playgroud)

添加另一个文件extension.ts,其中添加prototype

String.prototype.myCustomFn = function(text : string) : string {
  return 'myCustomFn';
};
Run Code Online (Sandbox Code Playgroud)

然后将该extension.ts文件导入到根index.ts文件中:

import './extension';
Run Code Online (Sandbox Code Playgroud)

现在您可以String().myCustomFn(text: string);在任何地方添加您的内容。


PS 将文件包含.d.ts到编译文件中非常重要。财产typeRoots不是必需的。

tsconfig.json:

{
  "compilerOptions": {
    "outDir": "dist"
  },
  "include": [
    "src",
    "types" // here is the .d.ts file
  ],
  "exclude": [
    "**/node_modules"
  ]
}

Run Code Online (Sandbox Code Playgroud)