Add @vue/typescript-plugin

[mcchrish]

Starting Volar v2.0, it is now recommended to setup LSP as a typescript-plugin. Depending on your setup, tsserver or typescript-tools.nvim, you may need to install the plugin globally or as a dependency in the project. To give more flexibility on these options, it would be nice to allow installing this plugin via Mason.

https://github.com/vuejs/language-tools/tree/master/packages/typescript-plugin

Tracking issue where everyone is figuring out how to set it up properly: vuejs/language-tools#3925

Related issues:

• Integrating with volar 2 pmizio/typescript-tools.nvim#249
• Support @vue/typescript-plugin yioneko/vtsls#148

[RayGuo-ergou]

You don't need @vue/typescript-plugin installed, you can just use @vue/language-server's location. See: vuejs/language-tools#3925 (comment)

[mcchrish]

Thanks! Probably directing to the same path as the installed vue-language-server is the more stable option to keep both versions the same. Here's my config for vtsls.

lspconfig.vtsls.setup {
	filetypes = { "typescript", "javascript", "javascriptreact", "typescriptreact", "vue" },
	capabilities = capabilities,
	settings = {
		vtsls = {
			tsserver = {
				globalPlugins = {
					{
						name = "@vue/typescript-plugin",
						location = require("mason-registry")
							.get_package("vue-language-server")
							:get_install_path() .. "/node_modules/@vue/language-server",
						languages = { "vue" },
						configNamespace = "typescript",
						enableForWorkspaceTypeScriptVersions = true,
					},
				},
			},
		},
	},
}