Sublime Text 3-CSS自动完成功能，无需输入属性值

Question

因此，我知道当您开始输入值时，自动填充功能非常有用。 例如，第二次在文本对齐方式中键入"c" ： c输入，弹出可用的自动完成值（例如center, left, right ）。

但是，当我使用Dreamweaver时，对于具有特定值选项的属性，例如text-align (center, right, left), display (block, inline-block), cursor (pointer, default), etc. ，自动完成弹出窗口会立即显示键入属性后，它不会等到我开始键入一个值。 在输入text-align:输入后，它将显示自动完成弹出窗口，为我提供选项center, right, left 。

我的媒体资源自动填充功能触发后，应立即触发值自动填充功能：

• 所以我输入te之后
  
• “ te”属性的自动完成弹出窗口显示text-align, text-decoration, text-shadow等。
  
• 然后我按Enter键选择text-align ...
  
• 然后在按Enter键后，应立即显示一个自动完成弹出窗口以显示text-align值： center, left, right 。

知道如何在Sublime Text 3中实现吗？

Answer 1

使用小插件和一些首选项插入完成后，您可以让ST直接显示自动完成弹出窗口：

在ST中打开CSS文件后，打开“首选项”菜单，然后选择“首选项-特定于语法”。 将以下内容添加到右侧的设置中：

"auto_complete_triggers":
[
    {
        "characters": ": ",
        "selector": "source.css meta.property-list.css meta.property-value.css"
    },
],

并保存。 这将告诉ST在键入:时自动在CSS文件中显示自动完成弹出窗口，或者在语法需要属性值时输入空格。

现在，不幸的是，ST不认为自动完成功能会“键入”任何内容，因此，当从自动完成弹出窗口中选择text-align类的属性值（插入text-align: ：）时，不会自动触发此触发器。 因此，为了解决这个问题，这是我们需要一个小插件的地方。 从“工具”菜单中，选择“开发人员”->“新插件...”。

选择所有文本并替换为以下内容，并将其保存在ST建议（ Packages/User/ ）文件夹中，如show_autocomplete_after_completion.py ：

import sublime
import sublime_plugin


class AutoCompleteListener(sublime_plugin.EventListener):
    def on_post_text_command(self, view, command_name, args):
        if command_name in ('commit_completion', 'insert_best_completion'):
            act = view.settings().get('auto_complete_triggers', [])
            scope = view.scope_name(view.sel()[0].begin())
            char = view.substr(view.sel()[0].begin() - 1)
            for trigger in act:
                if sublime.score_selector(scope, trigger['selector']) > 0:
                    if char in trigger['characters']:
                        view.run_command('auto_complete', { 'insert_best_completion': False })
                        break

该插件基本上可以检测到何时插入了完成内容（尽管由于ST API的限制，但是它无法检测到何时使用鼠标单击条目-参见https://github.com/SublimeTextIssues/Core/issues / 1166 ），并且如果插入符号前的文字/字符与设置中定义的自动完成触发器之一匹配，则它将再次显示自动完成弹出窗口。

Answer 2

您可以尝试此软件包。 该软件包为您的.less和.scss（或.sass）建立索引，并缓存您的mixins，变量，类或ID名称，并在html和css上自动完成。 它使用mixin参数自动完成您的less和sass mixins。 它还支持emmet补全，并在弹出窗口中获取CSS类。 -

https://github.com/subhaze/CSS-Extended/