sublime怎么配置代码片段的触发范围_Snippet作用域配置教程

40次阅读

<div>

配置Sublime Text代码片段触发范围需设置.sublime-snippet文件中的<scope>标签,其值通过ToolsDeveloperShow Scope Name获取当前光标位置的准确作用域,如source.js或text.html,并根据需要支持单个、多个或更具体的上下文范围,确保Snippet在正确文件类型和代码环境中触发。

sublime怎么配置代码片段的触发范围_Snippet作用域配置教程

配置Sublime Text的代码片段(Snippet)触发范围,核心就在于理解和设置Snippet文件中的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

scope

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>标签。简单来说,它决定了你的代码片段在哪些文件类型或更具体的代码上下文中才能被激活。如果你发现某个Snippet总是不工作,或者在不该出现的地方跳出来,那八成就是这个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

scope

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>没设对。

解决方案

要为Sublime Text的代码片段配置触发范围,你需要编辑或创建一个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

.sublime-snippet

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>文件,并修改其中的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

<scope>

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>标签。

  1. 打开或创建Snippet文件:

    • 如果你想修改一个已有的Snippet,可以通过<div style="position:relative; padding:0px; margin:0px;">
      Preferences

      <div>div>div> -> <div style="position:relative; padding:0px; margin:0px;">

      Browse Packages...

      <div>div>div>,然后找到对应的包(比如<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      User

      <div>div>div><div>div>div>包存放你自定义的Snippet),再找到<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      .sublime-snippet

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>文件。

    • 创建一个新Snippet的话,路径是<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      Tools

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Developer

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;">

      New Snippet...

      <div>div>div>。Sublime会打开一个模板文件。

  2. 定位<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    <scope>

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>标签: 在新创建的Snippet模板中,你会看到类似这样的结构:

    <div style="position:relative; padding:0px; margin:0px;">

    <snippet>     <content><![CDATA[ Hello, ${1:this} is a ${2:snippet}. ]]></content>     <!-- Optional: Set a tabTrigger to activate the snippet -->     <!-- <tabTrigger>hello</tabTrigger> -->     <!-- Optional: Set a scope to activate only in a specific context -->     <scope>source.python</scope>     <!-- Optional: Set a description to show in the menu -->     <!-- <description>My Great Snippet</description> --> </snippet>

    <div>div>div>

    我们需要关注的就是<div style="position:relative; padding:0px; margin:0px;">

    <scope>source.python</scope>

    <div>div>div>这一行。

  3. 确定正确的Scope值: 这是最关键的一步。Sublime Text通过“作用域名称”(Scope Name)来识别当前光标所在位置的语法环境。要找到你需要的准确Scope,请这样做:

    • 打开一个你希望Snippet生效的文件(例如,一个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      .js

      <div>div>div><div>div>div><div>div>div><div>div>div>文件、<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      .html

      <div>div>div><div>div>div>文件或<div style="position:relative; padding:0px; margin:0px;">

      .py

      <div>div>div>文件)。

    • 将光标移动到你希望Snippet触发的位置。
    • 选择<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      Tools

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Developer

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Show Scope Name

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div> (或者按<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Ctrl+Alt+Shift+P

      <div>div>div><div>div>div> / <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Cmd+Shift+P

      <div>div>div><div>div>div>,然后输入<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      scope

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>并选择)。

    • Sublime会在窗口底部显示一个字符串,比如<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      source.js

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>,<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      text.html

      <div>div>div><div>div>div><div>div>div><div>div>div>,<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      source.css

      <div>div>div><div>div>div>,或者更复杂的<div style="position:relative; padding:0px; margin:0px;">

      source.html meta.tag.block.div

      <div>div>div>。这个字符串就是当前光标位置的Scope。

  4. 设置<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    <scope>

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>标签: 将你找到的Scope值填入Snippet文件的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    <scope>

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>标签中。

    • 单个Scope: 如果你只想让Snippet在JavaScript文件中生效,就写<div style="position:relative; padding:0px; margin:0px;">
      <scope>source.js</scope>

      <div>div>div>。

    • 多个Scope: 如果你想让Snippet在JavaScript和TypeScript文件中都生效,可以用逗号分隔,写成<div style="position:relative; padding:0px; margin:0px;">
      <scope>source.js, source.ts</scope>

      <div>div>div>。

    • 更具体的Scope: 如果你只想让Snippet在HTML文件中的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      <div>

      <div>div>div><div>div>div>标签内部生效,你可以使用更具体的Scope,比如<div style="position:relative; padding:0px; margin:0px;">

      <scope>text.html meta.tag.block.div</scope>

      <div>div>div>。通常,我们用最前面那个最通用的Scope就够了,比如<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      source.js

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>代表整个JavaScript文件。

  5. 保存Snippet文件: 保存后,你的Snippet就会根据配置的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    scope

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>在指定范围内生效了。记得文件名要以<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    .sublime-snippet

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>结尾。

Sublime Text的Scope到底是什么,它和文件类型有什么关系?

说实话,刚开始接触Sublime Text的时候,这个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

scope

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>的概念确实让人有点懵。它不像我们平时说的“文件类型”那么直白,但又和文件类型紧密相关。简单来说,<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

scope

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>是Sublime Text用来描述当前光标位置上下文的一种分层标识符。你可以把它想象成一个“地址”,这个地址不仅告诉你身处哪个“国家”(文件类型),还能精确到哪个“城市”(比如HTML里的<div style="position:relative; padding:0px; margin:0px;">

div

<div>div>div>标签),甚至“街道”(比如CSS属性值)。

它和文件类型当然有关系,但又超越了文件类型。比如,一个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

.js

<div>div>div><div>div>div><div>div>div><div>div>div>文件,它的基础Scope就是<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

source.js

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>。但如果你在一个HTML文件里写<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

<script>

<div>div>div><div>div>div>标签,那么<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

<script>

<div>div>div><div>div>div>标签内部的JavaScript代码,其Scope可能就会是<div style="position:relative; padding:0px; margin:0px;">

source.js.embedded.html

<div>div>div>,或者同时包含<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

text.html

<div>div>div><div>div>div><div>div>div><div>div>div>和<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

source.js

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>的更复杂组合。Sublime Text正是依靠这个Scope系统来决定如何高亮语法、如何自动补全,以及我们的Snippet在何时何地可以被触发。

这个系统很强大,因为它允许Sublime Text理解代码的结构,而不仅仅是文件扩展名。所以,当你配置Snippet的Scope时,你是在告诉Sublime:“这个Snippet,只在光标位置的‘地址’符合我设定的条件时才显示出来。”这就是为什么有时候只用<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

source.js

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>就能搞定,有时候却需要<div style="position:relative; padding:0px; margin:0px;">

text.html meta.tag

<div>div>div>这样更长的Scope链条。

如何找到我需要的准确Snippet作用域?

要找到准确的Snippet作用域,其实有个“万能钥匙”,那就是Sublime Text内置的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

Show Scope Name

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>功能。我个人在配置Snippet时,几乎每次都要用到它,因为它能直接告诉你当前光标位置最精确的“身份”。

具体操作步骤是:

  1. 打开目标文件: 比如,你希望在Vue文件的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
    <template>

    <div>div>div><div>div>div>标签内部触发一个Snippet,那就打开一个<div style="position:relative; padding:0px; margin:0px;">

    .vue

    <div>div>div>文件。

  2. 定位光标: 把光标精确地放到你希望Snippet生效的位置。比如,在<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
    <template>

    <div>div>div><div>div>div>内部,某个HTML标签的属性值里。

  3. 激活<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
    Show Scope Name

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>:

    • 最快的方式是使用快捷键:<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      Ctrl+Alt+Shift+P

      <div>div>div><div>div>div> (Windows/Linux) 或 <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Cmd+Shift+P

      <div>div>div><div>div>div> (macOS)。

    • 然后在弹出的命令面板中输入<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      scope

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>,选择<div style="position:relative; padding:0px; margin:0px;">

      Developer: Show Scope Name

      <div>div>div>。

    • 或者通过菜单栏:<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      Tools

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Developer

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Show Scope Name

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>。

  4. 观察底部状态栏: Sublime Text会在窗口底部状态栏显示一串Scope链。这串链条是从最通用到最具体的,用空格分隔。
    • 举例:
      • 在一个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
        .js

        <div>div>div><div>div>div><div>div>div><div>div>div>文件中,光标在普通代码行:你可能会看到<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        source.js

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>。

      • 在一个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
        .html

        <div>div>div><div>div>div>文件中,光标在一个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        <div>

        <div>div>div><div>div>div>标签内部:你可能会看到<div style="position:relative; padding:0px; margin:0px;">

        text.html meta.tag.block.div.html

        <div>div>div>。

      • 在一个<div style="position:relative; padding:0px; margin:0px;">
        .css

        <div>div>div>文件中,光标在一个属性值里:你可能会看到<div style="position:relative; padding:0px; margin:0px;">

        source.css meta.property-value.css

        <div>div>div>。

如何选择Scope:

  • 通用Snippet: 对于大多数通用的Snippet(比如在任何JS文件里都需要的<div style="position:relative; padding:0px; margin:0px;">
    console.log

    <div>div>div>),你通常只需要取最前面那个最通用的Scope,例如<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    source.js

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>,<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    text.html

    <div>div>div><div>div>div><div>div>div><div>div>div>,<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    source.css

    <div>div>div><div>div>div>,<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    source.python

    <div>div>div><div>div>div>等。

  • 特定上下文Snippet: 如果你的Snippet只应该在某个特定结构中触发,比如只在HTML的<div style="position:relative; padding:0px; margin:0px;">
    <img>

    <div>div>div>标签内部触发,或者只在CSS的<div style="position:relative; padding:0px; margin:0px;">

    @media

    <div>div>div>查询内部触发,那么你可能需要使用更长的Scope链。但通常情况下,我会尝试先用最简单的Scope,如果不行再逐步增加其特异性。

  • 多个文件类型: 如果你的Snippet适用于多种文件类型(比如一个通用的注释格式),你可以将多个顶级Scope用逗号分隔,例如<div style="position:relative; padding:0px; margin:0px;">
    <scope>source.js, source.ts, source.jsx</scope>

    <div>div>div>。

记住,<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

Show Scope Name

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>是你的最佳伙伴,它能帮你省去很多猜测和试错的时间。

<div> sublime怎么配置代码片段的触发范围_Snippet作用域配置教程 <div> Designer

Microsoft推出的图形设计应用程序

<div> sublime怎么配置代码片段的触发范围_Snippet作用域配置教程63 div> div> 查看详情 sublime怎么配置代码片段的触发范围_Snippet作用域配置教程 div>

Snippet作用域配置不当会带来哪些问题,以及如何调试?

Snippet作用域配置不当,说白了就是你的Snippet“找错了家”或者“找不到家”。这会带来一些让人头疼的问题,但幸运的是,它们通常都有明确的调试方法。

常见问题:

  1. Snippet完全不触发: 这是最常见的问题。你明明记得设置了<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
    tabTrigger

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>,但在对应的文件里输入后却没有任何反应。这通常是因为<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    scope

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>设置得过于狭窄,或者根本就没匹配上当前文件的Scope。比如,你把一个JavaScript Snippet的Scope设成了<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    source.python

    <div>div>div><div>div>div>,那它当然不会在<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    .js

    <div>div>div><div>div>div><div>div>div><div>div>div>文件里工作。

  2. Snippet在不该出现的地方触发: 这种情况相对少见,但也很烦人。比如,你只想让某个Snippet在HTML文件里工作,结果它在CSS文件里也能触发。这通常是<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
    scope

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>设置得过于宽泛,或者你使用了多个Scope,其中一个不小心包含了不希望触发的上下文。

  3. 多个Snippet冲突: 如果你有两个不同的Snippet,但它们的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
    tabTrigger

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>相同,并且<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    scope

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>也有重叠,那么Sublime Text可能只会触发其中一个,或者行为变得不可预测。

如何调试:

调试Snippet作用域问题,关键在于系统性地排查。

  1. 确认<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    tabTrigger

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>是否正确且唯一:

    • 首先,排除最简单的可能性。检查你的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      .sublime-snippet

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>文件中<div style="position:relative; padding:0px; margin:0px;">

      <tabTrigger>

      <div>div>div>标签里的内容是否拼写正确,以及你输入的字符是否完全匹配。

    • 更重要的是,确认这个<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      tabTrigger

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>没有被其他Snippet或者Sublime Text的内置补全功能占用。如果你不确定,可以暂时修改<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      tabTrigger

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>为一个很独特的字符串来测试。

  2. 使用<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

    Show Scope Name

    <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>验证当前Scope:

    • 这是最重要的调试工具。在你希望Snippet触发(或不触发)的确切光标位置,运行<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      Tools

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Developer

      <div>div>div><div>div>div><div>div>div><div>div>div> -> <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      Show Scope Name

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>。

    • 仔细比对底部状态栏显示的Scope字符串和你Snippet文件中的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      <scope>

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>标签内容。

    • 如果Snippet不触发: 你的Snippet <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      <scope>

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>可能与实际的Scope不匹配。

      • 尝试简化Snippet的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
        <scope>

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>。比如,如果你的Snippet <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        <scope>

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>是<div style="position:relative; padding:0px; margin:0px;">

        source.js meta.function

        <div>div>div>,但<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        Show Scope Name

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>只显示<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        source.js

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>,那么你的Snippet就不会触发。尝试将Snippet的Scope改为<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        source.js

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>,看看是否能解决问题。如果能,说明你原来的Scope太具体了。

      • 检查是否有拼写错误。Scope字符串是区分大小写的。
    • 如果Snippet在错误的地方触发: 你的Snippet <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      <scope>

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>可能过于宽泛。

      • <div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
        Show Scope Name

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>会显示当前位置的完整Scope链。你可以尝试从这个链中找到一个更具体的段落,作为Snippet的<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        <scope>

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>,以限制其触发范围。

      • 例如,如果你的Snippet在HTML文件和CSS文件都触发,但你只想要HTML,那确保<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
        <scope>

        <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>是<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

        text.html

        <div>div>div><div>div>div><div>div>div><div>div>div>而不是更通用的<div style="position:relative; padding:0px; margin:0px;">

        *

        <div>div>div>(虽然一般不会这么设置)。

  3. 逐步简化Snippet内容:

    • 如果Scope看起来没问题,但Snippet仍然不工作,暂时把<div style="position:relative; padding:0px; margin:0px;">
      <content>

      <div>div>div>里的内容简化到最基本(比如<div style="position:relative; padding:0px; margin:0px;">

      Hello World

      <div>div>div>),排除是Snippet内容本身导致的问题(虽然这种情况很少见)。

  4. 检查Snippet文件路径和文件名:

    • 确保你的Snippet文件存放在Sublime Text能够找到的<div style="position:relative; padding:0px; margin:0px;">
      Packages

      <div>div>div>目录下(通常是<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

      User

      <div>div>div><div>div>div>包)。

    • 文件名必须以<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">
      .sublime-snippet

      <div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>结尾。

  5. 重启Sublime Text:

    • 老生常谈但有时有效。Sublime Text在某些配置更改后,可能需要重启才能完全加载。

调试Snippet作用域需要一点耐心和细致,但只要你掌握了<div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;"><div style="position:relative; padding:0px; margin:0px;">

Show Scope Name

<div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div><div>div>div>这个工具,并能系统地排查,大部分问题都能迎刃而解。

<div style="display: inline-flex;"> 相关标签: <div style="display:flex;"> sublime css linux vue javascript python java html js Python JavaScript typescript css html 标识符 字符串 Property JS console function 作用域 windows macos sublime text linux div> div> <div>

大家都在看:

<div> .html" title="sublime怎么配置代码片段的触发范围_Snippet作用域配置教程">sublime怎么配置代码片段的触发范围_Snippet作用域配置教程 .html" title="SublimeText如何进行代码折叠_快速收起和展开代码块技巧">SublimeText如何进行代码折叠_快速收起和展开代码块技巧 .html" title="Sublime运行C++11标准代码_在构建系统中添加-std=c++11参数">Sublime运行C++11标准代码_在构建系统中添加-std=c++11参数 .html" title="sublime如何配置anaconda进行python代码检查_Sublime Anaconda插件Python代码检查配置">sublime如何配置anaconda进行python代码检查_Sublime Anaconda插件Python代码检查配置 .html" title="sublime怎么快速跳转到指定行_Sublime跳转到指定代码行号的快捷方法">sublime怎么快速跳转到指定行_Sublime跳转到指定代码行号的快捷方法 div> div> div> sublime css linux vue javascript python java html js Python JavaScript typescript css html 标识符 字符串 Property JS console function 作用域 windows macos sublime text linux

text=ZqhQzanResources