This is no longer needed as Emmet supports JSX - you just need to turn it all on. Did a quick tutorial: http://wesbos.com/emmet-react-jsx-sublime/
Thanks, @wesbos
className instead of classPackages/User directory.someClassa.someClass (list of tags look in Default (OSX).sublime-keymap, now it's a|div|span|p|button)div>p| [ | |
| { | |
| "keys": ["tab"], | |
| "command": "chain", | |
| "args": { | |
| "commands": [ | |
| ["expand_abbreviation_by_tab"], | |
| ["reg_replace", {"replacements": ["js_class"]}] | |
| ] | |
| }, | |
| "context": [ | |
| {"operand": "source.js", "operator": "equal", "match_all": true, "key": "selector"}, | |
| {"key": "preceding_text", "operator": "regex_contains", "operand": "(\\w+>\\w+|\\s(\\.?|a|div|span|p|button)\\.\\w+)", "match_all": true}, | |
| {"key": "selection_empty", "operator": "equal", "operand": true, "match_all": true} | |
| ] | |
| } | |
| ] |
| { | |
| "replacements": { | |
| "js_class": { | |
| "find": " class=\"", | |
| "replace": " className=\"", | |
| "greedy": true, | |
| "case": false | |
| } | |
| } | |
| } |
Ctrl+E expands all kind of abbreviations in any kind of file.
Ctrl+E < this is what I needed, more than enough for me. Thanks.
I have folowed all this all the latest packages etc, but emmet expansion seems to be working ONLY by creating div elements. So typing
.mydivand pressing tab, gives me<div className="mydiv></div>as it should, however, any other element; for example,h1.headertab does nothing at all. Not evenpgets expanded. I'm really trying to avoid going back to VSCODE as Sublime is so fast, but this configuration is beginning to feel a little vimish