VSCodium中Vue3+TS组件使用未定义prop无报错提示如何解决

问题原因 #

1. 当前ESLint配置中主动关闭了no-undef规则，该规则是检测未定义变量的核心规则，关闭后自然不会提示selectedColumns这类未声明变量的错误。
2. 你使用的plugin:vue/vue3-essential是最低强度的Vue规则集，默认未开启模板内未定义属性/变量的检测规则。
3. 若使用Vetur作为Vue开发插件，Vue3+TS场景下Vetur不支持模板内的类型校验和未定义变量检测，必须使用Volar插件。
4. 代码中存在拼写错误：defineComponent配置项的组件注册字段应为components，你写为了单数component，会导致注册的PrimeVue组件失效，不过该问题和当前提示问题无关。

解决步骤 #

1. 修复ESLint规则配置
   打开.eslintrc.js，找到rules下的"no-undef": ["off"]，修改为：

"no-undef": ["error"]

同时新增Vue专属校验规则：

rules: {
  // 原有规则保持不变，新增以下内容
  "vue/no-undef-properties": "error", // 检测模板中使用但未在data/props/computed中声明的属性
  "vue/no-undef-components": "error" // 检测未注册的自定义组件
}

2. 更换编辑器Vue插件
   卸载Vetur插件，安装Volar插件，这是Vue3官方推荐的开发插件，完整支持模板内TS类型校验、未定义变量提示。
   安装完成后开启Volar的Take Over模式：

• 打开VSCodium扩展面板，搜索@builtin typescript
• 禁用「TypeScript and JavaScript Language Features」插件
• 重启VSCodium生效

3. 确认ESLint校验范围
   打开VSCodium设置，搜索eslint.validate，确保配置中包含vue项，示例配置：

"eslint.validate": ["javascript", "typescript", "vue"]

4. 验证配置是否生效
   重启VSCodium后，先在项目根目录运行npm run lint，如果命令行已经可以检测到selectedColumns未定义的错误，说明ESLint配置正常；如果命令行能提示但编辑器无提示，检查编辑器ESLint插件是否正常启用、工作区是否信任。

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