CODEWITHSUNDEEP
jsonsublimetext3emmet
surfbird0713
surfbird0713

Reputation: 1219

Custom abbreviation snippet not expanding past first element in Emmet Sublime Text 3

I am new to Emmet. Trying to create a custom abbreviation that expands to:

<link rel="stylesheet" href="http://www.domain.com/path/CSstyles.css">
<link rel="stylesheet" href="http://www.domain.com/path/CDstyle2.css">
<link rel="stylesheet" href="http://www.domain.com/path/DEstyle.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

so I can easily insert a set of styles and script for a site I work on a lot.

I am working in Sublime Text 3 and went to Sublime > Preferences > Package Settings > Emmet > Settings - User and added the following as a starting point:

{
    "snippets": {
         "html": {
            "abbreviations": {
                "lclinks": "<link rel=\"stylesheet\" href=\"http://www.domain.com/path/CSstyles.css\" />+<link rel=\"stylesheet\" href=\"http://www.domain.com/path/CDstyles.css\" />"

            }
         }
    }
}

Which worked, but did not expand past the first style reference. I tried replacing the + with an n\t\ with the same results. I found an example online and plugged that in instead to see if that worked, but it still does not expand past the first element. What am I doing wrong? The documentation here doesn't really address multiple line snippets.

        {
            "snippets": {
                 "html": {
                    "abbreviations": {
                        "lclinks": "<div class=\"block\">\n\t<div class=\"text\">\n\t\t<h3>|</h3>\n\t\t<p></p>\n\t</div>\n</div>"

                    }
                 }
            }
        }

Upvotes: 0

Views: 369

Answers (1)

Sergey Chikuyonok
Sergey Chikuyonok

Reputation: 2691

In your example, you are using abbreviations section which is actually parses provided single element HTML tag to use it as a reference for building output. And what you are trying to do is to create a regular text snippet. E.g. a chunk of arbitrary code.

If you read closer snippets.json section, you’ll see that given file contains abbreviations and snippets sections that has different meanings, described here.

In your example, you have to use either snippets section or use aliases in your abbreviations section:

{
    "snippets": {
         "html": {
            "abbreviations": {
                "lclinks": "link[href=http://www.domain.com/path/CSstyles.css]+link[href=http://www.domain.com/path/CDstyle2.css]"
            }
         }
    }
}

Upvotes: 1

Related Questions