VSCode自动检测代码质量_VSCode离线维护Vue项目【技巧】-VSCode-PHP中文网

vue项目eslint在.vue文件中静默失效，主因是volar/vetur未正确加载导致lsp链路中断，且.eslintrc.cjs不作用于区；需确认右下角显示vue(volar)、配置eslint-plugin-vue规则、启用volar.config.json并确保node_modules/@vue/language-core存在。

vscode自动检测代码质量_vscode离线维护vue项目【技巧】

离线 Vue 项目无法触发 ESLint 或类型检查，不是插件没装，而是语言服务根本没启动或配置未生效。

ESLint 在 .vue 文件里静默失效的真正原因

VSCode 的 ESLint 扩展不会自动读取 .eslintrc.cjs 并作用于 <template></template> 区域——它只对 <script></script> 块生效，且前提是 Volar（Vue 3）或 Vetur（Vue 2）已正确加载并把 ESLint 接入 LSP 链路。

打开 .vue 文件后右下角必须显示 Vue (Volar) 或 Vue (Vetur)；若显示 HTML 或 Plain Text，ESLint 根本不运行
检查项目根目录是否存在 eslint.config.js（新版）或 .eslintrc.cjs，且其中 extends 包含 @vue/eslint-config-typescript（TS 项目）或 @vue/eslint-config-standard（JS 项目）
离线时 node_modules/.bin/eslint 必须存在；运行 npx eslint --version 无输出，说明 ESLint 没装进 devDependencies，或离线安装漏了依赖
<template></template> 中的校验（如 v-model 绑定未定义变量）需额外启用 eslint-plugin-vue 的 valid-v-model 规则，仅靠基础配置不覆盖模板区

Volar 的模板类型检查为什么没反应

Volar 默认关闭模板内联类型检查（<template></template> 中 {{ count }} 是否有定义、@click 参数是否匹配），必须手动开启，且依赖 tsconfig.json 和 volar.config.json 同时就位。

Ainative Vue Sdk

使用 `@ainative/vue-sdk` 为 Vue 3 应用添加 AI 聊天功能。适用于以下场景：(1) 安装 `@ainative/vue-sdk`，(2) 在 Vue 组件中使用 `useChat` 组合式函数，(3) 提供……

下载

确保 tsconfig.json 中有 "types": ["vue"] 和 "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.vue"]
在项目根目录新建 volar.config.json，内容为：
```
{"plugins": {"typescript": {"enabled": true}}}
```
重启 VSCode 后执行命令面板中的 Volar: Restart Server，不是只 reload window
若仍无提示，检查状态栏是否显示 Vue (Volar) —— 若显示 Vue (Vetur)，说明旧插件未禁用，会拦截模板检查能力

离线环境里 ESLint + Prettier 协同失败的典型表现

保存后代码没格式化、报错红线不消失、editor.codeActionsOnSave 不触发修复，本质是二者冲突或路径未对齐，离线时更难排查。

editor.codeActionsOnSave 中设 "source.fixAll.eslint" 前，必须确认 ESLint 扩展已识别当前文件：打开命令面板 → ESLint: Show Output Channel，看是否有 “No ESLint configuration found” 报错
Prettier 对 <script></script> 生效，ESLint 对 <script></script> 和 <template></template> 分别校验；二者规则重叠（如 semi）会导致保存时反复拉扯，建议在 .prettierrc 中关掉与 ESLint 冲突项：
```
{"semi": false, "singleQuote": true}
```
，再由 ESLint 统一管
离线时 package.json 的 devDependencies 必须含 eslint、prettier、@vue/eslint-config-prettier，缺任意一个，VSCode 就无法调起对应二进制
若用 Volar，[vue] 块的默认格式化器必须设为 johnsoncodehk.volar，而不是 esbenp.prettier-vscode；后者不支持 <template></template> 区域