Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Sublime Text: Emmet tab handler in other files than HTML without CTRL + E?

I'd like to use Emmet inside other filetypes/syntax modes than HTML. Especially in .tpl files from Smarty and other template files of different CMS. Is there any way I can use the tab handler in those files too? I don't like to hit in other files CTRL + E because the only difference is the file extension and some template parts.

like image 711
suntrop Avatar asked Apr 15 '13 17:04

suntrop


2 Answers

Emmet limits Tab handler for some known file types because there’s no sane way to integrate with ST native snippets. E.g. if you try to expand, for example, foo abbreviation, Emmet doesn’t know if you want to transform it into <foo> tag or you want to expand native ST snippet associated with this trigger. So uses some tricks to determine what you’re trying to do. While this may work for HTML, in other languages it may annoy you with false triggers.

If you are 100% sure that you don’t need native ST snippets in your templates files, you can do the following: open user’s keymap file (find Key Bindings — User menu item in ST) and add the following code there:

[{
    "keys": ["tab"], 
    "command": "expand_abbreviation_by_tab", 
    "context": [
        {
            "operand": "SYNTAX SCOPE", 
            "operator": "equal", 
            "match_all": true, 
            "key": "selector"
        }, 
        {
            "match_all": true, 
            "key": "selection_empty"
        }, 
        {
            "operator": "equal", 
            "operand": false, 
            "match_all": true, 
            "key": "has_next_field"
        }, 
        {
            "operator": "equal", 
            "operand": false, 
            "match_all": true, 
            "key": "auto_complete_visible"
        }, 
        {
            "operator": "equal", 
            "operand": false, 
            "match_all": true, 
            "key": "setting.disable_tab_abbreviations_on_auto_complete"
        }, 
        {
            "match_all": true, 
            "key": "is_abbreviation"
        }
    ]
}]

Where SYNTAX SCOPE is a scope name for your syntax, you can see it in status bar by pressing Ctrl+Shift+P (Mac) or Ctrl+Alt+Shift+P (PC)

like image 74
Sergey Chikuyonok Avatar answered Dec 26 '22 02:12

Sergey Chikuyonok


you could find edit the snippets.json in emmet's folder (Packages\Emmet\emmet)

add this:

"tpl": {
    "extends": "html"
},

change tpl to whatever file extension you will like to enable the emmet code expansion.

there are haml,sass example at the end of the snippets.json too, you could imitate them.

like image 44
Allan Ruin Avatar answered Dec 26 '22 01:12

Allan Ruin