如何为通过<script>标签引入的JavaScript库发布全局属性的TypeScript类型声明

要为你的global._superNewProperty添加完整的类型支持（包括嵌套成员），可以按照以下步骤来操作：

1. 定义完整的嵌套类型结构 #

首先，你需要把OurSuperType以及它的所有嵌套成员的类型都明确出来。根据你提到的foo()、goo、hoo.ioo，可以这样定义：

// 先定义嵌套的子类型
interface HooType {
  ioo: string; // 替换成你实际的类型，比如number、boolean或其他自定义类型
}

// 定义主类型OurSuperType
interface OurSuperType {
  foo: () => void; // foo方法的类型，若有参数/返回值请按需调整
  goo: string;     // goo属性的类型，根据实际场景修改
  hoo: HooType;    // 嵌套的hoo对象类型
}

2. 扩展全局globalThis类型 #

接下来，在全局声明块中添加这个属性的类型声明——注意必须使用var（正如你发现的，let/const不会被挂载到globalThis的类型上，和JS全局变量的行为一致）：

declare global {
  /* eslint-disable no-var */
  var _superNewProperty: OurSuperType;
}

3. 配置TypeScript项目，确保类型声明被正确生成 #

因为你的dist/index.js是由TypeScript项目编译生成的，需要确保类型声明文件同步输出到dist目录：

• 将上述类型代码放在一个单独的.d.ts文件中（比如src/global.d.ts），或者直接写在生成index.js的TS源码文件顶部（推荐前者，结构更清晰）。
• 在项目的tsconfig.json中，确保：
  • declaration设置为true（开启自动生成类型声明文件）；
  • include数组包含你的类型声明文件（比如"src/**/*.d.ts"）；
  • outDir指向你的dist目录，保证编译后的.d.ts文件和index.js同目录。

4. 确保全局声明生效（关键） #

如果你的类型声明文件是模块文件（包含import/export语句），必须在文件末尾添加export {}，让TypeScript识别它为模块，否则全局声明不会生效：

// 上面的类型定义和全局声明...

export {};

5. 在其他项目中引用类型 #

当其他项目通过<script>标签引入dist/index.js后，只需要在TS文件顶部添加引用指令：

/// <reference types="internal/location/dist/index.d.ts" />

这样TypeScript就能正确识别global._superNewProperty的所有成员类型，包括foo()调用、goo属性访问、hoo.ioo的嵌套访问，不会再抛出Property does not exist的错误。

内容的提问来源于stack exchange，提问作者Manu Artero