Question

我在Typescript中构建一个依赖P5.js library。

的应用程序

P5.js在全局命名空间中放置了很多函数，因此只需说出draw()和ellipse(x, y, w, l)等内容就可以在webapp中调用它们。

我在Webstorm工作，我希望Webstorm能够为我执行静态分析，因此我将P5.js的函数名称添加到p5.d.ts文件（there is no p5 .js发布的Typescript定义文件），如：

declare var setup: () => void;
declare var draw: () => void;
declare var background: (color: number) => void;
declare var stroke: (r: number, g: number, b: number) => void;
...

然而，这并不理想。

＃1：这些函数实际上会返回一些东西 - 一个P5对象 - 它包含所有这些方法，但它通常不会被使用。

＃2：我仍在整个应用程序中调用这些方法，没有任何前缀或任何内容。这使得这些函数实际来自哪里有点模棱两可。

还有更多问题......

有人可以提供一些关于如何为像P5.js这样的库创建.d.ts的指示吗？

Answer 1

将这些作为函数编写更自然。您还可以声明一个接口类型来表示常见的返回类型（我假设它们将它设置为“链接”API？）

declare function stroke(r: number, g: number, b: number): P5;
declare function background(color: number): P5;

interface P5 {
  stroke(r: number, g: number, b: number): P5;
  background(color: number): P5;
}

不幸的是，在TypeScript中，没有办法说“同时将这部分作为全局范围”，因此您必须复制这些定义。

关于＃2，嗯，这是P5的问题？我会看看P5文档是否提供了一种更智能的方式来调用这些函数。将大量内容放在全局范围内不再是JS库的常见模式，因此可能还有其他方法可以实现。

更新

显然是there is another way to use P5.js functions without polluting the global namespace。

如何为将方法放在全局命名空间（窗口）上的库编写Typescript定义文件？

1 个答案:

更新