javascript - 如何覆盖 TypeScript UMD 全局类型定义？

Question

我已经安装了 three@^0.103.0，它有自己的类型定义。

在我项目的 src/global.d.ts 中我有:

import * as _THREE from 'three'

declare global {
    const THREE: typeof _THREE
}

然后在 src/global.ts 我有

import * as THREE from 'three'
(window as any).THREE = { ...THREE }

然后在 src/my-code.js 中，我尝试将 THREE 用作全局变量，f.e.

console.log(new THREE.Vector3(1,2,3)) // ERROR, 'THREE' refers to a UMD global, but the current file is a module. Consider adding an import instead.

它告诉我 'THREE' 指的是全局 UMD，但当前文件是一个模块。考虑改为添加导入。。

当我跳转到 THREE 的定义时，它会将我带到 node_modules/three/src/Three.d.ts，这不是我的 src/global.d.ts 文件。

那么，TypeScript 似乎忽略了我的 global.d.ts 定义？

我的 tsconfig.json 包含

  "allowJs" true,
  "checkJs" true,
  "include": ["src/**/*"]

我有 global.d.ts 在 src 里面。

如果我添加

/// <reference path="./global.d.ts" />

到 src/my-code.js 文件 (JavaScript) 的顶部，然后它就可以工作了，我可以跳转到 THREE 的定义，它带我到我的 global.d.ts 文件。

为什么没有 reference 注释就不能工作？

Answer 1

对于 three.js，您可以在 tsconfig.json 中声明编译器选项 allowUmdGlobalAccess:

"compilerOptions": {
    "allowUmdGlobalAccess": true,
}

这将使 typescript 能够访问您的项目全局 UMD，安装时会列出 three.js。然后您可以在您的项目中以与例如 JQuery 相同的方式使用它。

如果此选项不可用 - 更新您的 typescript 。

Some details