Sublime text 3:如何在自定义字符串/标签/函数中包装所选文本(laravel 语言助手示例)

Dom*_*kN. 3 laravel sublimetext3 laravel-blade

看看这段代码:

<p>This is nice text!</p>
Run Code Online (Sandbox Code Playgroud)

我想要实现的是选择This is nice text!并使其像这样:

<p>{{ __('This is nice text!') }}</p>
Run Code Online (Sandbox Code Playgroud)

这是 Laravel 语言助手的基本示例。它有更多的实现。

Oda*_*urd 5

一般来说,将所选文本与其他文本换行的最简单方法是使用片段来执行这项工作。片段允许您以几种不同的方式将任意文本插入缓冲区,并且还允许包含扩展发生时所选文本的任何内容。

要查看此操作,您可以Tools > Developer > New Snippet从主菜单中进行选择,这将为您创建一个片段模板。完成后,将文件的全部内容替换为以下文本并保存代码段。Sublime 会默认你的User包作为位置,你可以选择任何你想要的名字;只要确保扩展名是sublime-snippet为了让 Sublime 能够识别文件。在这个例子中,我将文件命名为localize.sublime-snippet.

<snippet>
    <content><![CDATA[
{{ __('${0:${SELECTION}}') }}
]]></content>
    <tabTrigger>localize</tabTrigger>
    <description>Localize text</description>
    <scope>text.blade</scope>
</snippet>
Run Code Online (Sandbox Code Playgroud)

如此处所示,片段是 XML 文件。上面的链接是关于片段的非官方文档,所以我们简单地说:

  • 该CDATA部分的内容是将展开的片段文本
  • $在该段身体有特殊的含义,因此,如果要插入文字$,你需要指定\$,而不是
  • 这tabTrigger是一个可以用来手动扩展代码段的短语;它是可选的
  • 该description是什么样的片段是文字描述; 它是可选的
  • 该scope指示了段适用; 它是可选的

片段内容可以包含编号的字段,例如$0,$1等等,当片段展开时,Sublime 会将光标定位在$1供您输入文本,然后$2在您按下时跳转到Tab等等,直到所有字段都填写完毕,这使得光标跳转到$0(片段的“出口”)。

另外值得注意的是,scope 这里假设您使用Laravel Blade Highlighter包进行语法高亮显示。如果不是,则在编辑刀片文件时使用Tools > Developer > Show Scope Name并替换text.blade为弹出窗口中的第一行。

现在有了代码片段,我们可以自动做一些事情。首先,在刀片文件中,您可以输入选项卡触发器文本并按下Tab,代码段的内容将展开,将光标放在单引号内($0代码段中的 ),以便您可以输入一些文本:

示例代码段扩展

适用于当前情况的片段列表也会自动添加到命令面板中,作为前缀为Snippet:; 的命令。您可以Tools > Snippets从主菜单中使用,也可以直接打开命令面板并进行命令搜索以查看适用于当前情况的代码段。在这里我们可以看到我们的localize代码片段正在显示;描述来自于代码段中的标签,Sublime 还提醒我们如何触发代码段。

命令面板中的代码段

所以现在回到你最初的换行问题,请注意代码段的正文包含以下内容:

{{ __('${0:${SELECTION}}') }}
Run Code Online (Sandbox Code Playgroud)

在${0}被指定在当片段完成展开域(其中有没有)光标应该去,而:${SELECTION}部分被说这个字段的默认值应为选定的文本。

当您使用上述localizeTab扩展代码段的方法时,没有选定的文本,因此光标最终位于字符串的中间。但是,如果您从命令面板触发代码段,则可以先选择文本。在这种情况下,所选文本将被代码段替换,但由于代码段捕获了所选内容,因此您最终会得到包含所选内容的文本:

通过命令面板扩展

对于这种你经常做的事情,你也可以使用insert_snippet命令使代码段展开;在这种情况下,您将首先选择文本来包装它,但如果没有选择,代码段将随着光标在单引号内展开,就像您手动完成一样。

例如,您可以创建如下所示的键绑定:

{
    "keys": ["ctrl+alt+l"],
    "command": "insert_snippet",
    "args": {
        "name": "Packages/User/localize.sublime-snippet"
    },
    "context": [
            { "key": "selector", "operator": "equal", "operand": "text.blade" },    
    ]
},
Run Code Online (Sandbox Code Playgroud)

context此处的部分使绑定仅在刀片文件中处于活动状态,而不是在任何地方都与scope代码段中的工作方式类似;这是因为该insert_snippet命令直接插入代码段而不做任何检查。

同样,您也可以通过创建一个Context.sublime-menu在您的User包中命名的文件(即与您将代码段保存到上面的位置相同的位置)并使用以下内容将其添加到右键单击上下文菜单中:

[
    { "caption": "-", "id": "end" },

    {
        "caption": "Localize Blade Text",
        "command": "insert_snippet",
        "args": {
            "name": "Packages/User/localize.sublime-snippet"
        },
    },  
]
Run Code Online (Sandbox Code Playgroud)

无论您正在编辑什么文件,这里的菜单命令都将始终可用,因为如上所述,该insert_snippet命令不会限制基于scope. 不过,您可以使用一个简单的小插件来解决这个问题(此处未涵盖,因为这个答案非常庞大)。

最后要提到的一件事是,如果您insert_snippet直接使用命令(即,当您不使用命令面板或Tab扩展方法时),您可以跳过此处的一些步骤。

该insert_snippet命令可以采取contents代替的参数name的参数; 虽然name参数指定了应该展开的片段,但contents参数只直接包含片段内容。这为您节省sublime-snippet了首先必须创建文件的步骤。

对于此处的示例,此键绑定将执行与上述相同的操作,但不需要存在代码段文件:

{
    "keys": ["ctrl+alt+l"],
    "command": "insert_snippet",
    "args": {
        "contents": "{{ __('${0:${SELECTION}}') }}"
    },
    "context": [
            { "key": "selector", "operator": "equal", "operand": "text.blade" },    
    ]
},
Run Code Online (Sandbox Code Playgroud)