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

Question

因此，我知道当您开始输入值时，自动填充功能非常有用。例如，第二次您以text-align键入"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)，以及是否在插入标记前紧接了文本/字符匹配设置中定义的自动完成触发器之一，然后它将再次显示自动完成弹出窗口。