Custom JavaScript snippets for emmet (in Sublime Text 2)

Question

I am trying to add some custom javascript snippets and abbreviations to the snippets.json file of Emmet, but I can't get it to work! (I am using Sublime Text 2.)

If I put this into the end of the settings.json

"javascript": {

    "abbreviations": {
        "while": "while(true)\n{\n\t\n}"
    },

    "snippets": {
        "asdf": "qwerty"
    }
}   

nothing happens. (I set the syntax of the file to javascript obviously)

But if I replace 'javascript' with 'css':

"css": {

    "abbreviations": {
        "while": "while(true)\n{\n\t\n}"
    },

    "snippets": {
        "asdf": "qwerty"
    }
}

it correctly overwrites the built in CSS snippets, and works fine. (I obviously set the syntax to css [otherwise it does NOT work])

What am I missing? according to this: http://docs.emmet.io/customization/snippets/ I should be able to define snippets for custom languages this way.

Note: I have tried 'js' for the language name too.

Rotund

What about the Snippets page implies that you can add support for custom languages? I don't think Emmet is designed for Javascript; you'd probably be better off with something like SublimeCodeIntel to power up your Javascript development. Still, this question might help you (Emmet used to be called Zen Coding), though I don't know for certain. – Clientage

Thank you, the question you linked is very helpful, but I decided to use Sublime's built-in Snippets. – Rotund

Answer 1

You should use js as syntax name since Sublime Text defines JavaScript scope as source.js. In future, you should use source.(SYNTAX_NAME) part for syntax name.

And you shouldn’t use abbreviations section for snippets since abbreviations defines element blocks and should be written as HTML element. Use snippets section.

Note that in JS files in ST editor you have to use Ctrl+E to expand abbreviations since Tab key is disabled for this syntax.

And, as Protractor Ninja noted, it’s not a good idea to use Emmet snippets in editors that supports native ones.

Palenque

Thank you for the answer! After researching some more I found this: github.com/sergeche/emmet-sublime/issues/207 [I think you answered that one too :)] and decided to give the built-in snippet support of Sublime Text a try. (I wanted to use emmet originally because I wanted to store all my snippets at one place, and make sure nothing overlaps with the other one.) I find it to be a bit overcomplicated in my opinion [only one snippet per file, etc.], but I think I managed to get used to it, and it is pretty well-featured, so again, thanks for your answer! :) – Rotund

Thanks for your answer Sergey. I was trying to create a custom JavaScript snippet in my snippets.json file but it wasn't working. After reading your answer I moved my code from the abbreviations section to the snippets section and now everything works great! (I can now insert a generic object literal into my code with a few keystrokes!) – Assisi