vscode 在 JavaScript 文件中使用类型化定义

Question

VSCode版本：1.20.0

首先，我认为我对 Visual Studios Code IntelliSense 的了解：

tsconfig.json/jsconfig.json 的存在应该表明 vscode 该目录是一个 TypeScript/JavaScript 项目 (docs)。这意味着 IntelliSense 应该知道目录中的所有 .js 和 .ts 文件（关于 include 和 exclude 配置属性），以及所有 classes/definitions 导出通过这些文件而不必明确引用它们。
在任何情况下，您都可以通过显式引用文件让 IntelliSense 知道 classes/definitions 由文件导出。这可以通过 require()、import 或 /// <reference path="..." />.
您可以混合使用 TypeScript 和 JavaScript 文件。

鉴于这些先入之见，我无法 vscode 按预期工作。请参阅下面的简单示例项目。 objective 是为了能够在 test.js JavaScript 文件中使用 test.d.ts 类型定义 TypeScript 文件中定义的 Person class 定义。但是，IntelliSense 抱怨它不知道 Person class:

请注意，IntelliSense 适用于 npm install-ed 的包。

鉴于假设 #1，我只需要包含 tsconfig.json 文件即可。即便如此，我也尝试在 includes 中明确列出 typings/test.d.ts 和 test.js。我还尝试在 compilerOptions.typeRoots.

中列出 typings

给定假设 #2，在 test.js 到 ./typings/test.d.ts 中包含三斜杠引用指令应该有效。

那里有很多过时的信息，因为 vscode 已经改变了它处理配置、输入等的方式。我已经阅读了我能找到的所有内容，但我无法让它工作。

有什么想法吗？我在这里错过了什么？

tsconfig.json

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "lib": ["es6"],
    "allowJs": true,
    "checkJs": true
  },
  "exclude": [
    "node_modules"
  ]
}

test.js

/// <reference path="./typings/index.d.ts" />

/** @type {Person} */
const p = {};

typings/test.d.ts

export class Person {
  name: string;
  age: number;
}

Answer 1

截至 2018 年 5 月 (v1.24) 版 VSCode，TypeScript 版本已更新至 2.9，其中包含 import() 类型的功能。

这意味着我们也可以像这样在 JSDocs 中使用 import()：

/** @type {import('./typings/test').Person} */
const p = {};

and/or

/** @typedef {import('./typings/test').Person} Person */

/** @type {Person} */
const p = {};

这也允许我们引用其他 JavaScript 文件中定义的类型，即使它们没有被导出。不需要 tsconfig.json 或任何其他配置文件，也不需要使用 TypeScript 文件。完整示例：

func1.js

/**
 * @typedef MyStruct
 * @property {string} fu
 * @property {number} bar
 */

module.exports = function func1() {
  // ...
}

func2.js

/**
 * @param {import('./func1').MyStruct} options 
 */
module.exports = function func2(options) {
  // ...
  // IntelliSense definition for this function:
  // func2(options: MyStruct): void
}

您还可以从节点模块中引用类型：

/** @type {import('async').AsyncCargo} */

注意：我确实发现了一个可能的错误。如果您 import() 的文件没有导出任何内容，智能感知就会中断。

vscode 在 JavaScript 文件中使用类型化定义

vscode Using Typed Definitions in JavaScript Files

intellisense

jsdoc

typescript

visual-studio-code