Sublime中的快速console.log插入

时间:2017-08-03 01:23:39

标签: sublimetext3 sublimetext2

很多时候,当我调试时,我想注销这样的一行:

console.log("~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~");
console.log(dataThatImTryingToSee);
console.log("~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~");

但是,必须始终输入console.log行的内容会很烦人。有没有办法在Sublime中添加可以插入console.log一行的热键?

1 个答案:

答案 0 :(得分:3)

Sublime可以使用名为Snippets的内容执行此操作,它允许您以各种方式重复使用文本位,以使您的编码生活更轻松。

要开始使用,请从菜单中选择Tools > Developer > New Snippet...,然后使用以下内容替换您在此处看到的内容,然后将其保存在Sublime默认选择的位置,即User包。只要名称以sublime-snippet结尾,名称无关紧要,但请记住您使用的名称,因为您将在一分钟内需要它。

<snippet>
    <content><![CDATA[
console.log("~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~");
console.log(${1:$SELECTION});
console.log("~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~");${0}
]]></content>
    <description>Debug log an item to the console</description>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>dlog</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.js</scope>
</snippet>

如果您不熟悉代码段,则XML的CDATA部分内的文本是代码段的正文,它将插入到文档中。

${0}${1}是“字段”,您可以随时通过输入文字进行制表。字段以数字顺序遍历,但特殊字段${0}表示光标最终应该结束的位置,在这种情况下,它位于最后一行的末尾,因此您可以继续编码。

字段的格式为${#:default},其中最初为该字段显示的文本为default。这会在触发时自动显示在代码段中,但如果您愿意,它会被选中以供您键入。

特殊字段$SELECTION将替换为在代码段触发时恰好选择的任何文本(更多内容在一秒内)。

保存代码段后,您已经有几个选项可以触发它,只要您处于JavaScript文件中(语法必须设置为JavaScript,因此请务必先保存所有新文件) )。

首先,如果您打开命令选项板并输入文本Snippet以将命令列表过滤到包含该文本的命令列表,您将看到适用于当前文件的所有片段,并且在该列表中一个显示Snippet: Debug log an item to the console的条目,当您选择它时会触发该代码段。

在这种情况下,如果您选择了任何文本,它将自动放入第二个console.log,这样您就可以选择一个变量或者您拥有的内容并触发该代码段以直接记录它。

其次,您只需输入文字dlog并按 Tab 即可展开代码段。上面提到的命令调色板条目右侧有文本dlog,tab,提醒您。根据您的设置,您也可能会获得自动完成弹出窗口。

您的问题专门讨论了添加热键,这也是可能的。在这种情况下,您希望向自定义键绑定添加类似于此的绑定:

{
    "keys": ["alt+shift+d"],
    "command": "insert_snippet",
    "args": {
      "name": "Packages/User/data_log.sublime-snippet"
    },
    "context":
    [
        { "key": "selector", "operator": "equal", "operand": "source.js" },
    ]
},

您可以自然地将密钥更改为您想要的任何内容。另请注意,您提供的代码段的名称必须与保存文件的名称相匹配。如果您按照上述说明操作,则表示已保存在Packages\User

现在,当您按下该键时,该片段会触发。如上所述,如果您选择了任何文本,它将自动插入第二个console.log

请注意,在所有情况下,当片段触发时,您将首先将光标设置在第二个console.log内(可能已经存在一些选定的文本),并且Sublime正在等待您完成该文本的输入字段,请再次按 Tab 跳到代码段的末尾。

作为对此的提醒,您会注意到状态行(如果已打开状态)告诉您Field 1 of 2告诉您自己在摘录中。

此示例假定您正在使用JavaScript,因此上面的代码段和键绑定都只会在当前文件是JavaScript时触发。如果您使用的是其他语言,则可以从代码段和/或密钥绑定的scope部分中删除context,以使其适用于所有文件,或修改其中的范围以匹配你想要定位的语言。

这只是描述了你可以用一个片段拉出来的表面。您还可以执行多次使用相同字段以使相同文本出现在多个位置,执行正则表达式替换等操作。请查看上面的链接以获取更多信息。