sublime text 3 在写 css 时自动提示类名的解决方案

sublime无法提示类名真的特别头疼，网上找到了解决方法，但是又还是有些小问题，以下是我根据原作者整理的基础上，进行详细的操作，以及加上我自己的一些修改，目前已经解决了该问题。

一、设置All Autocomplete

1、打开sublime编辑器，ctrl+shift+p把以下代码复制进去回车

Package Control: Add Repository

2、然后进入输入，再复制以下代码回车

https://github.com/andruhon/SublimeAllAutocomplete

3、ctrl+shift+p输入install package回车，然后输入All Autocomplete回车

 

 

4、按如图步骤找到并打开All Autocomplete的user文件

打开的文件是空的，把以下代码复制进去保存

{
	"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": "./\\()\"'-:,.;<>~!@#$%^&*|+=[]{}`~?",
}

到此All Autocomplete插件的设置就完成了，接下来解决sublime text3的css不出现自动提示框的问题。

 

二、修改css_completions.py文件

1、ctrl+shift+p输入install package回车，然后复制以下代码回车，安装插件

PackageResourceViewer

2、完成1之后，ctrl+shift+p复制以下代码回车，显示的界面如下图

 PackageResourceViewer: Open Resource

3、点击如上图的CSS，再选择css_completions.py将文件最后部分的

else:
                    l.append((prop, prop))

修改为

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

4、再次运行

PackageResourceViewer: Open Resource

点击CSS，选择Completion Rules.tmPreferences

CSS/Completion Rules.tmPreferences

进行如下修改并保存

<string>.*</string>  修改为  <string></string>

 

完成以上步骤，css类名就能自动提示了。

 

注：本文参考的文章地址 https://zhuanlan.zhihu.com/p/21824377