Shopify / theme-tools

Everything developer experience for Shopify themes
https://shopify.dev/docs/themes
MIT License
78 stars 24 forks source link

Feature Request: Add Emmet support #536

Open david-w-shopify opened 3 weeks ago

david-w-shopify commented 3 weeks ago

Is your feature request related to a problem? Please describe. Writing HTML is slow, and would be much faster if I could use emmet expansions.

Describe the solution you'd like Support for Emmet expansions (examples here https://code.visualstudio.com/docs/editor/emmet).

As a basic example, I could then type

.my-element#id

After pressing tab, it would be expanded to

<div class=”my-element” id=”id”></div>
charlespwd commented 3 weeks ago

It seems like we don't need to do anything. The following .vscode/config.json works (This is what the other extension does:)

{
      "emmet.triggerExpansionOnTab": true,
      "emmet.includeLanguages": {
        "liquid": "html"
      }
}

There's just one thing I don't like though: this adds the emmet completion options everywhere. Even when you're typing Liquid code. They also appear to have a very high priority in the completion window.

Image

Maybe we simply tell people through this issue that you can turn that on yourself? There would be 0 code changes other than switching this to on by default with the extension.

david-w-shopify commented 3 weeks ago

🤦 Wish I'd realised it was that simple.

Also I'd never noticed the completions being included within Liquid contexts before. Can't be unseen and I totally agree that I don't like that. I imagine letting people know they can enable it this way if they want to, with this caveat is fine for now, but think it would be better enabled by default in the future if the issue you raised can be resolved.