如何配置VSCode使其利用整个工作区提供JavaScript代码提示

一、修正jsconfig.json配置 #

你当前配置里的"module": "commonjs"是为Node.js模块化场景设计的，和你浏览器全局执行的JS环境不匹配。换成下面的配置更合适：

{
  "compilerOptions": {
    "target": "ES6", // 匹配你实际使用的JS语法版本
    "module": "none", // 禁用模块系统，适配浏览器全局变量环境
    "allowJs": true, // 允许VSCode解析工作区内的JS文件
    "checkJs": false, // 关闭类型检查，避免原生JS出现不必要的语法报错
    "baseUrl": ".", // 将项目根目录设为路径解析的起点
    "paths": {
      "*": ["js/*"] // 引导VSCode优先从js目录查找相关文件
    }
  },
  "include": [
    "js/**/*", // 包含js目录下所有文件及子目录
    "*.js" // 如果根目录有单独的JS文件，也纳入范围
  ],
  "exclude": [
    "node_modules" // 排除第三方依赖目录，防止干扰代码提示
  ]
}

二、启用jQuery的代码提示 #

要让VSCode识别jQuery的API，两种简单方法可选：

• 若用npm管理依赖，在终端执行：npm install @types/jquery --save-dev，安装后VSCode会自动加载jQuery的类型定义，提供完整的API补全。
• 不用npm的话，下载对应版本的jquery.d.ts文件放到项目根目录或js目录下，然后在主JS文件顶部添加注释：/// <reference types="jquery" />。

三、让配置生效 #

保存jsconfig.json后，重启VSCode（或按Ctrl+Shift+P输入Reload Window刷新窗口）。之后可以做两个测试：

• 在一个JS文件里调用另一个文件定义的全局函数/对象，检查是否有自动补全提示。
• 输入$('selector').，看是否弹出jQuery的方法列表。

四、优化自定义代码的提示精准度 #

给你自己编写的函数、对象添加JSDoc注释，VSCode会根据注释提供更详细的提示信息，示例：

/**
 * 初始化用户模块
 * @param {Object} options 配置参数
 * @param {string} options.username 用户名
 * @param {number} options.age 用户年龄
 */
function initUser(options) {
  // 业务逻辑代码
}

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