Expand emmet autocompletes to multiple lines in sublime text

Question

When I type the following in sublime text 2 with emmet:

.one>label{foo}+input:r

I get one long line of code

<div class="one"><label for="">foo</label><input type="radio" name="" id=""></div>

is there any way to get emmet/sublime to output this style instead?

<div class="one">
    <label for="">foo</label>
    <input type="radio" name="" id="">
</div>

I tried playing around with the snippets.json with no success

Make sure you’ve set your syntax to HTML or XML or didn’t override default output profile for HTML. — Sergey Chikuyonok, Feb 14 '14 at 12:13
Switching syntax to xml solves the issue (HTML doesn't), I think it may possibly html(liquid) syntax that causes the issue, thanks — Tony UK, Feb 14 '14 at 12:51
HTML (Liquid)is not the same as HTML: it has different scope so Emmet thinks you’re using it in unknown syntax, most likely inside strings of programming languages. This is why it produces single-line output — Sergey Chikuyonok, Feb 14 '14 at 13:26

score 12 · Accepted Answer · edited Sep 02 '21 at 15:32

12

Create Packages/User/Emmet.sublime-settings with the content of

{
    // Output profiles for syntaxes
    // http://docs.emmet.io/customization/syntax-profiles/
    "syntaxProfiles": {
        "html": {
            "tag_nl": true
            // "tag_nl_leaf": true
        }
    }
}

And check the documentation for more information about tag_nl, tag_nl_leaf and other options.

edited Sep 02 '21 at 15:32

Audwin Oyong

2,247
3
15
32

answered Mar 06 '14 at 20:51

Taylan

3,045
3
28
38

score 0 · Answer 2 · answered Feb 14 '14 at 09:58

0

Its probably not the best answer but what I do is have reindent bound to a key and just hit that after.

In Preferences - Keybindings-User put something like

{ "keys": ["f12"], "command": "reindent"}

However im sure there is a way to do this properly

answered Feb 14 '14 at 09:58

Dominic Green

10,142
4
30
34

Expand emmet autocompletes to multiple lines in sublime text

2 Answers2

Linked