一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

emmet编辑器自定义呈重写代码段:snippets.json

时间:2022-06-25 19:41:57 编辑:袖梨 来源:一聚教程网

当然,这篇文章不是准备歌颂ST的,而是为怎么用好emmet这款强大的工具而写!

言归正传,emmet除了上面强大的功能外,还可自定义snippets。比如 说:bd+ + tab 输出 border:1px solid #000,我们可以重写 emmet 扩展目录下的snippets.json文件可实现snippets重写!

sublime text3不像sublime text2能直接找到emmet snippets.json文件,要在st目录的PackagesUser 下手动创建emmet目录,并在该目录下创建snippets.json文件,该文件默认定义参考链接:

https://github.com/emmetio/emmet/blob/master/snippets.json

我们只需重写要重新定义的snippets即可,如下所示snippets.json定义:

 代码如下 复制代码

{
"css": {
"filters": "html",
"snippets": {
"bd+": "border:${1:1px} ${2:solid} #${3:f00};",
}
}
}

标红部分为主要重写内容,重写规则,详细可见:

http://docs.emmet.io/customization/snippets/

重写规则后,还在手动在Emmet.sublime-settings文件中指定该扩展路径,实例如下:

 代码如下 复制代码

{
"extensions_path": "E:/Sublime Text Build 3061 x64/Data/Packages/User/emmet"
}

经测试,extensions_path只支持绝对路径,相对路径不能被识别!

 

值得注意的是,照官方说明:

http://docs.emmet.io/css-abbreviations/vendor-prefixes/

css3属性是默认智能加上浏览器前缀输出的,如:bdrs输出

 代码如下 复制代码

-webkit-border-radius: ;
-moz-border-radius: ;
border-radius: ;

本人试过将bdrs重写,使之不带浏览器前缀输出,但发现找不到官方提供的方法,不知能否实现,有知道实现方法的网友,请告知,不甚感谢!

热门栏目