如何成功使用内部有自己导入的 TypeScript 文件中的接口？

Question

我正在使用 WebStorm 开发一个 React JavaScript 项目，并尝试使用 TypeScript 接口和 JSDoc 注释（希望我们将来能转换为完整的 TypeScript...）为我们的 IDE（以及 VS Code）实现类型提示。

当接口位于没有导入的文件中时，如果我引用命名空间和接口，它会起作用：

//cart.js
/**
 * @returns {Prep.Cart}
 */
export const fetchCart = (cached = false, type = queryTypes.FULL) =>

//cart.ts
declare namespace Prep {
  export interface Cart {
    CustomerNumber: number
    // ...
  }
}

但是，如果包含该接口的 TypeScript 文件中有

TS2503: Cannot find namespace Prep

，我会收到错误

import

：

//cart.js
/**
 * @returns {Prep.Cart}
 */
export const fetchCart = (cached = false, type = queryTypes.FULL) =>

//cart.ts
import {Model} from 'sequelize'

declare namespace Prep {
  export interface Cart extends Model {
    CustomerNumber: number
    // ...
  }
}

如果我添加另一个自行定义命名空间的文件，则会收到错误

TS2694: Namespace Prep has no exported member Cart

：

// prep.ts
declare namespace Prep {}

因此，如果这些 TypeScript 文件之一中有导入，那么从中导出或声明的任何内容都不会被拾取。

是否有更好或不同的方法来执行此操作，使我能够可靠地引用命名空间和接口，同时让接口扩展从另一个文件或包导入的另一种类型？

另外，我确实有一个 jsconfig.json 和 tsconfig.json 应该会自动选择它们。一切都按预期工作，否则似乎只是在 TypeScript 文件中使用导入。

Answer 1

您可以使用

*.d.ts

来避免代码中的冲突：

• 像这样修改你的

  tsconfig.json

  ：

  "include": ["src/**/*.ts", "src/**/*.d.ts"]

• 创建一个单独的文件

  .d.ts

  将所有声明放入其中。