I have incorporated three@^0.103.0 into my project, along with its own type definitions.
Within my project's src/global.d.ts, I have the following:
import * as _THREE from 'three'
declare global {
const THREE: typeof _THREE
}
Additionally, in src/global.ts, I have:
import * as THREE from 'three'
(window as any).THREE = { ...THREE }
Furthermore, in src/my-code.js, I am attempting to utilize THREE as a global variable, for example:
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.
The error message states that
'THREE' refers to a UMD global, but the current file is a module. Consider adding an import instead.Upon inspecting the definition of THREE, it redirects me to
node_modules/three/src/Three.d.tssrc/global.d.ts file.
It appears that TypeScript is disregarding my global.d.ts declarations?
My tsconfig.json includes the following:
"allowJs" true,
"checkJs" true,
"include": ["src/**/*"]
Moreover, my global.d.ts resides within the src directory.
If I include
/// <reference path="./global.d.ts" />
at the beginning of my src/my-code.js file (JavaScript), then it functions correctly, allowing me to access the definition of
THREE</code which links to my <code>global.d.tsWhy is it necessary to add the reference comment for it to work?