为 VSCode/Monaco Intellisense 添加 JavaScript 类型提示

Question

有没有办法提示 VSCode/Monaco 的智能感知变量的类型。

我有一些这样的代码

var loc = window.location;
var gl = context1.getContext("webgl");
var ctx = context2.getContext("2d");

我看到VSCode知道loc是一个URL

但它不知道 gl 是什么

它也不知道ctx是什么

这是有道理的，拥有一个函数 return 基于其输入的不同类型是一种不寻常的情况。

但它确实有 WebGLRenderingContext

的类型数据

它知道 CanvasRenderingContext2D

有没有办法让我告诉 vscode/monaco gl 是 WebGLRenderingContext 的一个实例并且 ctx 是 CanvasRenderingContext2D 的一个实例无需切换到打字稿？也许通过添加某种评论？

我需要在 monaco 中工作的解决方案（至少在我的测试中显示所有相同的完成）因为这是一个 WebGL 教程站点，实际上不是 VSCode 但我'我希望解决方案是一样的。

Answer 1

更新：从 Monaco 的 0.9.0 开始，这些类型注释现在可以使用了

看到 JSDoc style type annotations 在 VSCode 工作，尽管他们似乎在摩纳哥工作。

var loc = window.location;

/** @type {WebGLRenderingContext} */
var gl = context1.getContext("webgl");    

/** @type {CanvasRenderingContext2D} */
var ctx = context2.getContext("2d");

Answer 2

如果你愿意使用Typescript，你可以这样做：

var gl : WebGLRenderingContext;

Answer 3

正如 Micah 在对已接受答案的评论中指出的那样，外部模块仍然存在问题。如果库定义了一个全局对象，您可以从中引用类型，那么只需对模块执行 require 就可以启用 jsdoc 类型注释。否则，您可以通过导入所有内容并将其映射到您自己的名字来模仿这一点。

import * as Foo from 'foo'

/** @type {Foo.Foo} */
var foo;

https://github.com/Microsoft/TypeScript/issues/8237#issuecomment-213047062

为 VSCode/Monaco Intellisense 添加 JavaScript 类型提示

Adding JavaScript type hints for VSCode/Monaco Intellisence

javascript

intellisense

visual-studio-code

monaco-editor

更新：从 Monaco 的 0.9.0 开始，这些类型注释现在可以使用了