Javascript 类未在 Visual Studio Code 中获取 TypeScript 声明文件

Question

我有一个 Typescript/JavaScript 混合项目，我正在为一些 JavaScript 文件创建声明 d.ts 文件，以帮助管理多个类和子类。

但是，Visual Studio Code 看不到声明的类型。我在同一目录中有js 和相应的d.ts 文件。

例如：

my-class.js

class MyClass {
  constructor(options) {}

  action(num) {
    return num.toString()
  }
}

}

my-class.d.ts

export interface Options {
  a: boolean
  b: boolean
}

export declare abstract class MyClass {
  constructor(options: Options)
  action(num: number): string
}

例如，当我将鼠标悬停在 my-class.js 的 action 方法上时，IntelliSense 不会获取定义。

我尝试在my-class.js 顶部添加参考注释，但没有任何效果 (///<reference path="./my-class.d.ts" />)。

我在我的设置中将checkJs 选项设置为true。

我正在使用 VS Code 版本 1.19.1

我还需要采取其他措施才能使其生效吗？

Answer 1

确保您的工作文件夹中有一个 jsconfig.json 文件。拥有此配置文件后，您的 .d.ts 文件应该被包含/引用。

关于你的具体例子，据我所知，它不会像你期望的那样工作。这是因为声明范围。意思是，在你的 .d.ts 文件中你定义了一个带有 TypeScript 类型的 MyClass，然后在你的 .js 文件中你定义了第二个 MyClass，这第二个声明也有类型，它有 any 的默认类型。如果您从第一个类继承，那么它可能会按您的预期工作。

话虽如此，有些事情会奏效：

• 您应该在类的实例上获得 IntelliSense
• 您可以将 JSDoc cmets 添加到您的 .js 文件中以定义/链接 .d.ts 类型

例子：

my-class.d.ts

declare interface Options {
    a: boolean
    b: boolean
}

declare class MyClass {
  constructor(options: Options)
  action(num: number): string
}

my-class.js

class MyClass {
  /**
  * @param {Options} options 
  */
  constructor(options) {   
  }

  action(num) {
    return num.toString();
  }
}
var foo = new MyClass({ a: true, b: false } );
foo.action(88);

如果您将鼠标悬停在 .js 文件中的 foo 实例上，您会注意到您确实获得了正确的 IntelliSense

通过将 JSDoc 注释“@param {Options} 选项”添加到构造函数（），您还将获得正确的 IntelliSense

JSDoc 和 TypeScript：https://github.com/Microsoft/TypeScript/wiki/JsDoc-support-in-JavaScript VSCode 和类型检查：https://code.visualstudio.com/docs/languages/javascript#_global-variables-and-type-checking