javascript - 使用TypeScript通过JSDocs检查JS时，如何声明一个变量对应一个命名空间？

Question

在我的 JS 代码中，我导入一个模块，如下所示:

const toolbox = require('../toolbox')

/**
 * @param {toolbox.Hammer} hammer
 */
function useHammer(hammer) {
  let nail = new toolbox.Nail()
  hammer.ham(nail)
}

现在，因为我的 tools/index.d.ts 文件将 toolbox 导出为命名空间。我的 IDE 可以看到 hammer 有一个方法 ham 。惊人的!但它看不到 toolbox 中有一个成员 Nail 。

我尝试将 @module 和 @export 标签放入 toolbox/index.js 中，但没有成功。我还尝试将 @type {toolbox} 放在 require 语句之上，但我被告知 toolbox 在其自己的类型注释中直接或间接引用.

如何让我的 IDE 知道 toolbox = require('toolbox') 使 toolbox 对应于我的命名空间？

<小时/>

供引用的示例toolbox/index.js和toolbox/index.d.ts:

exports.Hammer = class {
  ham (nail) {
    if (Math.random() > 0.1) {
      exports.nailCount -= 1
      return 'bang!' 
    } else return 'Ouch my thumb!'
  }
}
exports.nailCount = 100
exports.Nail = class {}

export = toolbox
export as namespace toolbox

declare namespace toolbox {
  class Nail {}
  class Hammer {
    ham(n: Nail) : string
  }
}

还有我的 tsconfig(因为它有点 cargo 崇拜)

{
  "compilerOptions": {
    "allowJs": true,
    "target": "es5",
    "checkJs": true,
    "baseUrl": "../",
    "moduleResolution": "node",
    "noEmit": true
  }
}

Answer 1

您使用的是哪个 IDE？

在VS Code中，我可以看到Nail和nailCount显示为工具箱的一部分。

看这张图片:

此外，为了确保hammer.ham函数只接受 Nail例如，将一些属性添加到 Nail index.d.ts中的类定义例如。

// toolbox/index.d.ts

export = toolbox;
export as namespace toolbox;

declare namespace toolbox {
  class Nail {
    length: string; // new property added
  }
  class Hammer {
    ham(n: Nail): string;
  }
}

现在，在 main/index.js如果我们传递 Nail 以外的任何内容，我们会收到错误实例。例如

const toolbox = require("../toolbox");

/**
 * @param {toolbox.Hammer} hammer
 */
function useHammer(hammer) {
  let nail = new toolbox.Nail();
  hammer.ham("nail-string"); // this will show a red squiggle under "nail-string" since it is a string and the compiler expected a Nail instance
}

看这张图片: