如何让VSCode对.eslintrc.js提供语法检查与自动补全？

直接生效的解决方案 #

放弃函数包裹的写法，直接给module.exports的对象标注类型：

/** @type {import("eslint").Linter.BaseConfig} */
module.exports = {
  env: {browser: false, es2019: true, node: true},
  ignorePatterns: ["dist", "jsdoc", "out", "out2", "public"],
  extends: "eslint:recommended",
  parserOptions: {ecmaVersion: "latest"},
  // 其他配置项
}

配置完成后，VSCode会立刻对该对象进行类型校验——输入未知属性时会报错，按下Ctrl+空格也能弹出对应字段的自动补全。

为什么之前的函数方式失效？ #

核心原因是Linter.BaseConfig是泛型接口，定义为Linter.BaseConfig<Linter.RulesRecord, Linter.RulesRecord>。在JS文件中，用函数参数标注泛型类型时，TypeScript语言服务无法自动正确实例化泛型的具体参数，导致类型没有展开为包含env、parserOptions等字段的具体结构，自然无法触发检查和补全逻辑。

而你之前生效的自定义MultiConfig是普通非泛型类型，不存在这个问题，函数参数的类型标注能正常触发校验。

备选方案（显式实例化泛型） #

如果一定要保留函数包裹的写法，可以显式指定泛型的具体参数：

/** @typedef {import("eslint").Linter.BaseConfig<import("eslint").Linter.RulesRecord, import("eslint").Linter.RulesRecord>} BaseConfig */
/** @param {BaseConfig} c */
function castBaseConfig(c) {return c}
module.exports = castBaseConfig({
  // ...配置项
})

不过这种写法冗余，不如直接给导出对象标注类型简洁。

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