set auto complete on sublime text 3 for custom html elements

耗尽温柔 提交于 2019-12-22 06:30:20

问题


Good day,

how can I set auto complete on sublime text 3 for custom html elements, like for example if I type: dog then press tab it will become <dog></dog>.. thanks for your answer.


回答1:


You can create a custom .sublime-completions file for this. Create a new file with JSON syntax in Sublime, using the following contents (of course customized to your needs):

{
    "scope": "text.html - source, punctuation.definition.tag.begin",

    "completions":
    [
        { "trigger": "foo", "contents": "<foo>$0</foo>" },
        { "trigger": "bar", "contents": "<bar class=\"$1\">$0</bar>" },
        { "trigger": "baz", "contents": "<baz class=\"${1:myclass}\">$0</baz>" }
    ]
}

In the first example, typing foo and hitting Tab will insert <foo>|</foo> where | is the cursor position.

In the second example, typing bar and hitting Tab will insert <bar class="|"></bar>. The cursor will first be between the quotes following class= so you can enter your own class. Hitting Tab again will place the cursor just before </bar>.

The third example works just like the second, except that the class now has a default value. This value will be highlighted after typing baz and hitting Tab - you can either hit Tab again to keep the default value and move the cursor between the opening and closing tags, or you can enter your own value, hit Tab, and move the cursor to between the opening and closing tags.

Once you have everything set up how you like, save the file as Packages/User/HTML.sublime-completions, where Packages is the folder opened when you select Preferences -> Browse Packages....

For more information, follow the link above. To learn more about placeholders and variables, check out this documentation.

Good luck!



来源:https://stackoverflow.com/questions/22188239/set-auto-complete-on-sublime-text-3-for-custom-html-elements

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!