Skip to content

Commit

Permalink
docs: update readme with neovim lspconfig setup (#4134)
Browse files Browse the repository at this point in the history
* docs: update readme with neovim lspconfig setup

* docs: add italic to hint

* docs: nvim configured with lspconfig and drop mason

As not everyone is using mason, it's better to use plain lspconfig

* docs: indent of code block

* docs: nvim configuration tweak

* docs: add hybridMode default value to README.md

* docs: update readme for nvim lsp

* docs: readme nvim lsp tweak
  • Loading branch information
RayGuo-ergou authored Mar 22, 2024
1 parent ef908e2 commit 8caa6d8
Showing 1 changed file with 83 additions and 2 deletions.
85 changes: 83 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,89 @@
*Vue language client for coc.nvim*

[neovim/nvim-lspconfig](https://github.com/neovim/nvim-lspconfig) ⚡ 🤝 \
*Vue language server configuration for Neovim* \
[[Volar 2.0 version set up tutorial](https://github.com/vuejs/language-tools/issues/3925)]
*Vue language server configuration for Neovim*

<details>
<summary>How to configure vue language server with neovim and lsp?</summary>

### Hybrid mode configuration (Requires `@vue/language-server` version `^2.0.0`)

Note: The "Take Over" mode has been discontinued. Instead, a new "Hybrid" mode has been introduced. In this mode, the Vue Language Server exclusively manages the CSS/HTML sections. As a result, you must run `@vue/language-server` in conjunction with a TypeScript server that employs `@vue/typescript-plugin`. Below is a streamlined configuration for Neovim's LSP, updated to accommodate the language server following the upgrade to version `2.0.0`.

```lua
-- If you are using mason.nvim, you can get the ts_plugin_path like this
-- local mason_registry = require('mason-registry')
-- local vue_language_server_path = mason_registry.get_package('vue-language-server'):get_install_path() .. '/node_modules/@vue/language-server'

local vue_language_server_path = '/path/to/@vue/language-server'

local lspconfig = require('lspconfig')

lspconfig.tsserver.setup {
init_options = {
plugins = {
{
name = '@vue/typescript-plugin',
location = vue_language_server_path,
languages = { 'vue' },
},
},
},
filetypes = { 'typescript', 'javascript', 'javascriptreact', 'typescriptreact', 'vue' },
}

-- No need to set `hybridMode` to `true` as it's the default value
lspconfig.volar.setup {}
```

### None-Hybrid mode(similar to takeover mode) configuration (Requires `@vue/language-server` version `^2.0.7`)

Note: If `hybridMode` is set to `false` `Volar` will run embedded `tsserver` therefore there is no need to run it separately.

For more information see [#4119](https://github.com/vuejs/language-tools/pull/4119)

*Make sure you have typescript installed globally or pass the location to volar*

Use volar for all `.{vue,js,ts,tsx,jsx}` files.
```lua
local lspconfig = require('lspconfig')

-- lspconfig.tsserver.setup {}
lspconfig.volar.setup {
filetypes = { 'typescript', 'javascript', 'javascriptreact', 'typescriptreact', 'vue' },
init_options = {
vue = {
hybridMode = false,
},
},
}
```

Use `volar` for only `.vue` files and `tsserver` for `.ts` and `.js` files.
```lua
local lspconfig = require('lspconfig')

lspconfig.tsserver.setup {
init_options = {
plugins = {
{
name = '@vue/typescript-plugin',
location = '/path/to/@vue/language-server',
languages = { 'vue' },
},
},
},

lspconfig.volar.setup {
init_options = {
vue = {
hybridMode = false,
},
},
},
```

</details>

[mattn/vim-lsp-settings](https://github.com/mattn/vim-lsp-settings)\
*Vue language server auto configuration for vim-lsp*
Expand Down

0 comments on commit 8caa6d8

Please sign in to comment.