如何让VS Code显示JS ES6类调用不存在方法的错误？

这个问题我之前也碰到过，核心原因是原生JavaScript是动态类型语言，VS Code默认的JS语法检查不会主动检测这类“调用不存在的方法”的错误。不过咱们可以借助TypeScript的静态类型检查能力，让VS Code对普通JS文件也进行严格校验，就能实现你想要的错误提示了。

下面是具体的操作步骤：

1. 在项目根目录创建jsconfig.json配置文件 #

就在包含mod1.js和mod2.js的文件夹里，新建一个名为jsconfig.json的文件，把下面的内容粘贴进去：

{
  "compilerOptions": {
    "checkJs": true,
    "strict": true,
    "target": "ES6"
  },
  "include": ["*.js"]
}

这里的配置项作用： #

• checkJs: 告诉TypeScript要对JavaScript文件进行类型检查
• strict: 开启所有严格检查规则，其中就包括检测调用对象上不存在的属性或方法
• target: 指定代码适配的ES版本，设为ES6刚好匹配你用的模块语法

2. 确认VS Code使用内置的TypeScript版本 #

如果你的项目里安装了本地的TypeScript包，VS Code可能会优先用它，可能导致配置不生效。可以按下面步骤调整：

• 打开VS Code的命令面板（快捷键Ctrl+Shift+P或Cmd+Shift+P）
• 输入TypeScript: Select TypeScript Version
• 选择Use VS Code's Version，确保用的是编辑器内置的稳定版本

3. 可选：添加JSDoc注释让检查更精准 #

要是想让类型提示更明确，你可以给MyClass加上JSDoc注释，把类的方法定义清楚：

'use strict';
/**
 * @class
 */
export class MyClass {
  constructor() { }
  /**
   * 弹出提示框显示数字1
   */
  lala() { alert(1); }
}

做完这些配置后，你再看mod2.js里的c.lala2()，VS Code马上就会弹出错误提示：Property 'lala2' does not exist on type 'MyClass'.，完全符合你的需求。

内容的提问来源于stack exchange，提问作者user5182503