nvim-lspconfig Vue 语言服务器完整配置指南vue_ls 与 vtsls 双服务器 3 场景实战【免费下载链接】nvim-lspconfigQuickstart configs for Nvim LSP项目地址: https://gitcode.com/GitHub_Trending/nv/nvim-lspconfignvim-lspconfig 是 Neovim 的 LSP 快速起步配置集合内置了几百个语言服务器的默认参数。对于 Vue 项目当前主线版本中官方推荐的服务器组合是 vue_lsVue 官方语言服务器加 vtslsTypeScript 语言服务的 Neovim 封装。本文按场景给出可直接粘贴的配置、排障对照表和自查清单适合第一次在 Neovim 中搭建 Vue 开发环境的读者。先说结论用 vue_ls vtsls 这套组合如果项目基于 Vue 3直接启用 vue_ls 与 vtsls 两个服务器并给 vtsls 挂载 vue/typescript-plugin 插件即可获得模板HTML/CSS与 script 块TypeScript的完整支持。旧的 volar 配置在新版 nvim-lspconfig 中已改名并标记弃用写volar会自动映射到 vue_ls 并触发弃用警告见 lsp/volar.lua存量配置建议直接改名过渡。背景知识一句话早期 Vue 语言服务器有 takeover mode接管模式由它一个服务器承包 .vue 文件里所有代码的智能提示v3.0.0 起该模式被移除服务器改为 hybrid mode混合模式——只独占处理 HTML 与 CSS 部分TypeScript 相关请求转发给外部 TS 服务器。这就是必须引入第二个服务器的原因。对比项旧配置volar 单服务器新配置vue_ls vtsls服务器数量1 个2 个协同TypeScript 支持依赖服务器内置能力随版本移除vtsls 加载 vue/typescript-plugin 提供在仓库中的状态已改名弃用启用会收到警告当前主线推荐模板 / 样式支持单服务器全权负责vue_ls 独占 HTML/CSSVue 2 兼容随服务器升级失效需显式设置vue.target 2适用场景仅存量旧配置的平滑过渡Vue 3 新项目与存量项目安装两个服务器需要 Node.js 与 npm 环境# 全局安装 Vue 官方语言服务器与 vtsls npm install -g vue/language-server vtsls/language-server适用版本新版 nvim-lspconfig 主线volar 已更名为 vue_ls 的版本Neovim 0.10 及以上vtsls 的项目根判定在 0.11.3 后行为略有差异但配置写法一致。场景一最小配置——让 .vue 文件先有基础提示本节只解决一件事让 .vue 文件尽快具备基本提示适合先跑通再细调的用户。-- 启用 Vue 官方语言服务器负责 .vue 文件的 HTML/CSS 部分 vim.lsp.enable(vue_ls) -- 启用 vtsls负责 script 块建议与上一行同时启用 vim.lsp.enable(vtsls)vue_ls 默认绑定vue文件类型并以package.json作为项目根标记见 lsp/vue_ls.lua。如果只启用 vue_lsscript 块里不会有任何 TypeScript 提示——这是混合模式的设计不是配置错误。场景二TypeScript 完整支持——vue_ls 与 vtsls 协同配置这是绝大多数 Vue 3 TypeScript 项目需要的完整形态也是本文的重点。核心动作只有一个把 vue/typescript-plugin 注册进 vtsls 的 globalPlugins并让 vtsls 接管 vue 文件类型。-- 插件位置vue/language-server 包内部的 node_modules local vue_language_server_path vim.fn.stdpath(data) .. /mason/packages/vue-language-server/node_modules/vue/language-server local vue_plugin { name vue/typescript-plugin, location vue_language_server_path, -- 必须指定缺省会直接失效 languages { vue }, -- 必须包含 vue即使 filetypes 已列出 configNamespace typescript, } vim.lsp.config(vtsls, { settings { vtsls { tsserver { globalPlugins { vue_plugin } } }, }, -- 扩展 vtsls 支持的文件类型纳入 Vue 单文件组件 filetypes { typescript, javascript, javascriptreact, typescriptreact, vue }, })三点说明location示例基于 mason.nvim v2 的安装路径。若用 npm 全局安装可改为vue-language-server可执行文件所在目录下的node_modules/vue/language-servermason.nvim v1 用户可用require(mason-registry).get_package(vue-language-server):get_install_path()取路径。vue_ls 侧的转发逻辑已内置它监听tsserver/request请求自动在当前 buffer 上寻找 ts_ls / vtsls / typescript-tools 客户端并转发找不到时会重试 10 次。无需手写任何转发代码。⚠️ 不要同时启用 vtsls 与 ts_ls官方文档明确不建议两者并存。场景三Vue 2 遗留项目的兼容性参数检查本节仅适用于仍在维护 Vue 2 代码库的团队。vue_ls 默认按 Vue 3 处理Vue 2 项目需要显式声明 target并确认编译器包版本配套。-- 告诉语言服务器按 Vue 2 语法解析模板 vim.lsp.config(vue_ls, { settings { vue { target 2 } }, }) vim.lsp.enable(vue_ls)若模板仍报语法错误 优先检查项目依赖需要vue/compiler-sfc的 2.x 版本而不是 3.x。场景四大型项目——按需加载与 Mason 统一管理面向多包大仓库、或希望降低 Neovim 启动开销的用户。思路是延迟到打开 Vue 文件时才拉起服务器并交给 mason.nvim 统一安装省去手写安装路径。-- 按需加载打开 vue 文件时才启用两个服务器 vim.api.nvim_create_autocmd(FileType, { pattern vue, callback function() vim.lsp.enable(vue_ls) vim.lsp.enable(vtsls) end, })-- 由 mason.nvim 统一安装与管理场景二的 location 路径即由此而来 require(mason).setup() require(mason-lspconfig).setup({ ensure_installed { vue_ls, vtsls } })monorepo 无需特殊处理vtsls 会自动为每个子包定位对应的 tsconfig.json / jsconfig.json不会为每个包多开实例见 lsp/vtsls.lua 的 root_dir 逻辑。建议整个工作区使用同一版本的 TypeScript。症状诊断表按症状对号入座从上往下逐行核对症状最可能原因修复方式.vue 的 script 块无补全、无诊断vtsls 未启用或 globalPlugins 的languages缺少vue确认vim.lsp.enable(vtsls)存在检查vue_plugin.languages { vue }报错 Could not findts_ls,vtsls, ortypescript-toolslsp clientvue_ls 发出 TS 请求时找不到可用的 TS 客户端启用 vtsls 并确认其成功附着内置 handler 会重试 10 次仍报错说明 TS 服务器未启动打开 .vue 文件后服务器不启动npm 包未安装或不在 PATH重新执行全局安装命令用:checkhealth lsp检查状态Vue 2 项目模板报错、提示 Vue 3 语法问题未声明 Vue 版本vue_ls 默认按 Vue 3 处理设置settings.vue.target 2并确认vue/compiler-sfc为 2.xmonorepo 子包没有 TS 支持子包缺少 tsconfig.json / jsconfig.json为各包补齐配置vtsls 自动按包定位无需多开实例配置完成后的自查清单逐项打勾全部通过即可收工vue_ls 与 vtsls 均已通过vim.lsp.enable启用vue_plugin.languages包含vuevtsls 的filetypes包含vue没有同时启用 ts_ls 与 vtsls:checkhealth lsp中两个服务器对 .vue buffer 均显示已附着延伸阅读全部内置服务器的完整文档doc/configs.mdvue_ls 默认配置与请求转发源码lsp/vue_ls.luavtsls 默认配置含 Vue 插件示例与 monorepo 说明lsp/vtsls.lua如配置中遇到问题建议直接在 nvim-lspconfig 项目仓库提交 issue附上:checkhealth lsp的输出与 Neovim 版本方便维护者复现。【免费下载链接】nvim-lspconfigQuickstart configs for Nvim LSP项目地址: https://gitcode.com/GitHub_Trending/nv/nvim-lspconfig创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考