---
title: "💭 aca/emmet-ls: Emmet support based on LSP."
description: "!https://github.com/aca/emmet-ls"
date: 2023-09-08
published: true
tags:
  - webdev
  - nvim
  - thought
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/dbcd7936962689a857bc9f3c10934afaceced969997bea20f82496e8ed6034e2/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,
        },
      },
    }
})
```

!!! note

    This post is a <a href="/thoughts/" class="wikilink" data-title="Thoughts" data-description="These are generally my thoughts on a web page or some sort of url, except a rare few don&#39;t have a link. These are dual published off of my..." data-date="2024-04-01">thought</a>. It's a short note that I make
    about someone else's content online <a href="/tags/thoughts/" class="hashtag-tag" data-tag="thoughts" data-count=2 data-reading-time=3 data-reading-time-text="3 minutes">#thoughts</a>
