Sublimetext3 升华文本3中Vue源文件的周围背景标记?

Sublimetext3 升华文本3中Vue源文件的周围背景标记?,sublimetext3,Sublimetext3,当我在ST3中编辑JS文件时,我可以选择一个字符串,按backtick键,ST3将用backtick围绕所选字符串,这与使用引号和backets时的效果相同。但是,当源文件类型为Vue Component时,这将不起作用,取而代之的是单个反勾号将替换选定的字符串 是否有任何方法可以将配置更改为与Javascript相同的Vue组件的行为?匹配字符的自动配对以及将选定文本包装成适当的配对是密钥绑定的一种功能,该功能配置为仅在特定情况下通过使用密钥应用绑定上下文 例如,这是键绑定,通过选择文本并按“

当我在ST3中编辑JS文件时,我可以选择一个字符串,按backtick键,ST3将用backtick围绕所选字符串,这与使用引号和backets时的效果相同。但是,当源文件类型为
Vue Component
时,这将不起作用,取而代之的是单个反勾号将替换选定的字符串


是否有任何方法可以将配置更改为与
Javascript
相同的
Vue组件的行为?

匹配字符的自动配对以及将选定文本包装成适当的配对是密钥绑定的一种功能,该功能配置为仅在特定情况下通过使用密钥应用绑定
上下文

例如,这是键绑定,通过选择文本并按
,可以提供将所选文本用双引号括起来的功能,您可以使用
首选项>键绑定
并在左窗格中的默认绑定中搜索来查看该功能:

    { "keys": ["\""], "command": "insert_snippet", "args": {"contents": "\"${0:$SELECTION}\""}, "context":
        [
            { "key": "setting.auto_match_enabled", "operator": "equal", "operand": true },
            { "key": "selection_empty", "operator": "equal", "operand": false, "match_all": true }
        ]
    },
这里的键绑定是说
字符应该插入一个片段,其内容是用双引号括起来的选择;
上下文
表示只有在启用了
自动匹配
设置且存在选择时,密钥绑定才可用

默认绑定还包括其他类似的绑定,用于将内容包装在括号中、插入成对字符等

对于您询问的密钥绑定,这些密钥绑定由附带的
JavaScript
包提供;您可以使用命令调色板中的
查看包文件
,然后选择
JavaScript/Default.sublime键映射
文件来查看它们

(截至本文撰写之时)此包提供了6个绑定;您要使用的是第二个,如下所示:

    { "keys": ["`"], "command": "insert_snippet", "args": {"contents": "`${0:$SELECTION}`"}, "context":
        [
            { "key": "selector", "operator": "equal", "operand": "source.js - string" },
            { "key": "setting.auto_match_enabled", "operator": "equal", "operand": true },
            { "key": "selection_empty", "operator": "equal", "operand": false, "match_all": true }
        ]
    },
这与上面的默认设置非常相似,但请注意,
上下文
包含一个附加项,该项要求当前光标位置处的作用域
选择器匹配
source.js-string
,以便激活。这就是将键绑定限制为仅在JavaScript文件中处于活动状态的原因(特别是在除字符串之外的任何地方)

为了使这些绑定在Vue组件中处于活动状态,您需要将此文件中的绑定复制到用户密钥绑定中,然后修改
选择器
,使其与要使用它的点处的范围相匹配

通过使用菜单中的
Tools>Developer>Show scope Name
(或按菜单中可见的相关键),可以确定当前光标位置的作用域。这将显示光标所在字符的完整范围

关于作用域及其工作原理的全面讨论超出了本文的范围(双关语的用意温和),但(免责声明:我是视频作者)超出了主题。在这里,只需知道,一般来说,您使用的显示范围越多,匹配就变得越具体,因此您通常需要顶级范围,您正在使用的包的顶级范围是
text.html.vue

如果使用上面的命令查看代码范围,您将看到在Vue组件文件的
标记内部,键绑定可以按预期工作,而无需执行任何操作;这是因为Vue语法嵌入了JavaScript语法以突出显示那里的代码

我不是Vue开发人员,但似乎有些标记的属性也被视为JavaScript,例如:

      <li
        v-for="page in pages"
        :data-test="`page-link-${page}`"
        :key="page"
        :class="paginationClass(page)"
        @click.prevent="changePage(page);"
      >
您还可以使用范围
text.html.vue标点符号.definition.string.end
,它将匹配结束
仅限字符串的字符,在这种情况下,选择字符串的全部内容时将触发绑定。”。缺点是,即使选择了不应该是JavaScript的属性的文本,它也会触发

或者,您可以完全删除
选择器
行,您的自定义绑定将在您碰巧编辑的任何文件中执行此操作(只要启用了
自动匹配设置


您选择哪种方式取决于您的工作流以及工作方式对您的影响。

此操作的默认绑定将自身约束到
source.js
语法范围,因此要使它们与其他语法一起工作,您需要更改绑定的上下文。您使用什么软件包来支持
Vue
呢?我只对Vue.js使用
Vue语法高亮显示。
{ "key": "selector", "operator": "equal", "operand": "text.html.vue" },