Vue

info

You can enable the extra with the :LazyExtras command. Plugins marked as optional will only be configured if they are installed.

Alternatively, you can add it to your lazy.nvim imports

lua/config/lazy.lua

require("lazy").setup({
  spec = {
    { "LazyVim/LazyVim", import = "lazyvim.plugins" },
    { import = "lazyvim.plugins.extras.lang.vue" },
    { import = "plugins" },
  },
})

Below you can find a list of included plugins and their default settings.

caution

You don't need to copy the default settings to your config. They are only shown here for reference.

Includes the following extras

• lang.typescript

nvim-treesitter

Options

opts = { ensure_installed = { "vue", "css" } }

Full Spec

{
  "nvim-treesitter/nvim-treesitter",
  opts = { ensure_installed = { "vue", "css" } },
}

nvim-lspconfig

Add LSP servers

Options

opts = {
  servers = {
    volar = {
      init_options = {
        vue = {
          hybridMode = true,
        },
      },
    },
    vtsls = {},
  },
}

Full Spec

{
  "neovim/nvim-lspconfig",
  opts = {
    servers = {
      volar = {
        init_options = {
          vue = {
            hybridMode = true,
          },
        },
      },
      vtsls = {},
    },
  },
}

nvim-lspconfig

Configure tsserver plugin

Options

opts = function(_, opts)
  table.insert(opts.servers.vtsls.filetypes, "vue")
  LazyVim.extend(opts.servers.vtsls, "settings.vtsls.tsserver.globalPlugins", {
    {
      name = "@vue/typescript-plugin",
      location = LazyVim.get_pkg_path("vue-language-server", "/node_modules/@vue/language-server"),
      languages = { "vue" },
      configNamespace = "typescript",
      enableForWorkspaceTypeScriptVersions = true,
    },
  })
end

Full Spec

{
  "neovim/nvim-lspconfig",
  opts = function(_, opts)
    table.insert(opts.servers.vtsls.filetypes, "vue")
    LazyVim.extend(opts.servers.vtsls, "settings.vtsls.tsserver.globalPlugins", {
      {
        name = "@vue/typescript-plugin",
        location = LazyVim.get_pkg_path("vue-language-server", "/node_modules/@vue/language-server"),
        languages = { "vue" },
        configNamespace = "typescript",
        enableForWorkspaceTypeScriptVersions = true,
      },
    })
  end,
}