---
title: "aca/emmet-ls: Emmet support based on LSP."
description: "!https://github.com/aca/emmet-ls"
date: 2023-09-08
published: true
tags:
  - dev
  - neovim
  - thought
  - webdev
template: link
---


<div class="embed-card embed-card-external">
  <a href="https://github.com/aca/emmet-ls" class="embed-card-link" target="_blank" rel="noopener noreferrer">
    <div class="embed-card-image">
      <img src="https://opengraph.githubassets.com/b0ced08b915e91dbf2c16e05710bbb42bf5df9b406059c6cb8bab6228de5d814/aca/emmet-ls" alt="GitHub - aca/emmet-ls: Emmet support based on LSP. — Emmet support based on LSP. Contribute to aca/emmet-ls development by creating an account on GitHub." loading="lazy">
    </div>
    <div class="embed-card-content">
      <div class="embed-card-title">GitHub - aca/emmet-ls: Emmet support based on LSP.</div>
      <div class="embed-card-description">Emmet support based on LSP. Contribute to aca/emmet-ls development by creating an account on GitHub.</div>
      <div class="embed-card-meta">GitHub &middot; github.com</div>
    </div>
  </a>
</div>


This is the greatest nvim emmet plugin I have tried.  In the past I had tried the vim plugin a few times and just could not get a good flow with the keybindings and found it confusing for my occasional use.  `emmet-ls` just uses lsp-completion, so its the same flow as other completions.

You can try it out by installing with `:Mason`

## config

``` lua
local lspconfig = require('lspconfig')
local configs = require('lspconfig/configs')
local capabilities = vim.lsp.protocol.make_client_capabilities()
capabilities.textDocument.completion.completionItem.snippetSupport = true

lspconfig.emmet_ls.setup({
    -- on_attach = on_attach,
    capabilities = capabilities,
    filetypes = { "css", "eruby", "html", "javascript", "javascriptreact", "less", "sass", "scss", "svelte", "pug", "typescriptreact", "vue" },
    init_options = {
      html = {
        options = {
          -- For possible options, see: https://github.com/emmetio/emmet/blob/master/src/config.ts#L79-L267
          ["bem.enabled"] = true,
        },
      },
    }
})
```