Visual Studio Code JavaScript Intellisense 不适用于对象属性

Question

我正在使用 Visual Studio Code 1.11.1。

对于以下代码，Intellisense 工作正常，理解 canvas 变量的类型是 HTMLCanvasElement：

var canvas = document.getElementsByTagName('canvas')[0];

事实上，当我写下该变量的名称后跟一个点时，它会显示 HTMLCanvasElement 的所有属性和方法。

但是，使用以下代码，我将变量包装在一个对象中（充当命名空间），Intellisense 不再理解该变量的类型为 HTMLCanvasElement：

// create a namespace "App"
var App;
App = {};

App.canvas = document.getElementsByTagName('canvas');

当我编写“App.canvas”后跟一个点字符时，Intellisense 不会向我显示 HTMLCanvasElement 的所有属性和方法。事实上，它认为 App.canvas 类型为 any。

我也试过像下面的代码一样使用 @type 注释，但结果是一样的：

// create a namespace "App"
var App;
App = {};

/** @type {HTMLCanvasElement} */
App.canvas = document.getElementsByTagName('canvas')[0];

是否可以让 Intellisense 理解对象属性的变量类型（例如我的示例中的 App.canvas）？

Answer 1

我致力于 VSCode 的 JS/TS 支持。我们使用 TypeScript 项目来支持我们的 JS 和 TS 语言支持，所以相信你遇到了这个错误：https://github.com/Microsoft/TypeScript/issues/10868

作为一种解决方法，请尝试在 App 本身上声明 canvas 的类型：

/** @type {{canvas:HTMLCanvasElement}} */
var App;
App = {};

App.canvas = document.getElementsByTagName('canvas')[0];

使用对象字面量也应该有效：

var App = { canvas: document.getElementsByTagName('canvas')[0] }

我们正在考虑在这些情况下改进 IntelliSense