sublime text3 在写html和css时自动提示类名

最近用st3的时候发现了一个很费劲的问题，就是原来在用hbuilder写代码的时候css类名会自动提示，比如在html里面定义了一个自定义类名class=“classTest”，在css文件里给这个类名添加样式的时候，打出.cl开头几个字母，会自动加载所有相关类名列表，然后选择要添加样式的类名就行了，但是st3不行，必须复制过去或者一个字母一个字母敲，否则很容易出错，导致样式添加不成功，没有达到想要的效果，有的时候查找半天才发现定义的类名和css中的类名写的有出入，就很费时间。
磨刀不误砍柴工，为了提高效率，上网研究了半天，找到了解决办法，还是要搞插件，然后总结了一下，以防以后用到。

1、ctrl+shift+p打开Package Control，然后输入install package，打开插件安装界面。

2、输入All Autocomplete，回车，安装插件

3、安装以后，按下图打开

在这里插入图片描述
打开以后是一个空白文档，然后复制以下代码

{
	"apply_with_dash_hack_syntaxes": ["source.scss","source.sass","source.css","source.html"],
	"return_nothing_on_empty_prefix": true,
	"do_not_search_in_current_view": false,
	"word_separators": "./\\()\"'-:,.;<>~!@#$%^&*|+=[]{}`~?",
}

保存。

4、重复第一步

5、输入`PackageResourceViewer`，回车，安装插件

6、ctrl+shift+p，打开以后输入`PackageResourceViewer: Open Resource`，进入以下界面：

在这里插入图片描述
点开css，点开css_completions.py
翻到文件最后，将最后的if else那一部分（亲测有效以后写的说明，没截图= =）替换成以下代码：

if add_colon:
     l.append((prop + "\tproperty", prop + ": "))
 elif view.match_selector(locations[0], "meta.property-list.css"):
     l.append((prop + "\tproperty", prop))

改完以后长这样：
在这里插入图片描述
然后保存。

7、和上一步相似，再次ctrl+shift+p，打开以后输入`PackageResourceViewer: Open Resource`，点击css，然后打开 Completion Rules.tmPreferences

在这里插入图片描述将后几行里的<string>.*</string> 改成 <string></string>，保存。

到此为止，css类名就可以自动提示啦，领导再也不用担心我的速率^^