web编程之路Web前端之路

巧用sublime,不做重复敲键的码农

2017-02-24  本文已影响638人  hopevow

marco命令

在sublime中按 ctrl+q,开始输入,完成后再次按ctrl+q完成宏的录制,之后按ctrl+shift+q即可调用,宏命令是将刚刚录制的宏保存在宏缓存中,如果想持久使用,可以将宏保存起来并绑定到相应的快捷键。
在工具栏>保存宏即可将宏保存,后结结缀.sublime-macro
编辑快捷键配置文件如下

[
    {"keys": ["ctrl+alt+l"], "command": "run_macro_file", "args":{"file":"res://Packages/User/fuck.sublime-macro"}},
]

这样,你每次按ctrl+alt+l,即可以调用之前的宏文件。

snippets

snippets是sublime中的代码段,在开发中有一些重复出现的代码,我们可以将它们收录到snippets中,然后设置一个关键置触发,而不用重复的复制粘贴。

snippets的结构如下:

<snippet>
    <content><![CDATA[Type your snippet here]]></content>
    <!-- Optional: Tab trigger to activate the snippet -->
    <tabTrigger>xyzzy</tabTrigger>
    <!-- Optional: Scope the tab trigger will be active in -->
    <scope>source.python</scope>
    <!-- Optional: Description to show in the menu -->
    <description>My Fancy Snippet</description>
</snippet>

结构解析:

tabTrigger:
触发关键字,在相应位置输入关键字,然后在其后按下tab键即可将代码段引入。

$PARAM1 .. $PARAMn  Arguments passed to the insert_snippet command. (Not covered here.)
$SELECTION  The text that was selected when the snippet was triggered.
$TM_CURRENT_LINE    Content of the cursor’s line when the snippet was triggered.
$TM_CURRENT_WORD    Word under the cursor when the snippet was triggered.
$TM_FILENAME    Name of the file being edited, including extension.
$TM_FILEPATH    Path to the file being edited.
$TM_FULLNAME    User’s user name.
$TM_LINE_INDEX  Column where the snippet is being inserted, 0 based.
$TM_LINE_NUMBER Row where the snippet is being inserted, 1 based.
$TM_SELECTED_TEXT   An alias for $SELECTION.
$TM_SOFT_TABS   YES if translate_tabs_to_spaces is true, otherwise NO.
$TM_TAB_SIZE    Spaces per-tab (controlled by the tab_size option).

区域输入:

First Name: $1
Second Name: $2
Address: $3
User name: $1

在内容区域如此使用可以用tab键切换相应位置并进行修改,如果你想多点选择,名取一样即可。默认选择完毕停留在文本末尾,当然也可以通过$0来进行设置末尾位置(镜像区域),你还可以通过如下方法来设置tab区域的默认值

First Name: ${1:Guillermo}
Second Name: ${2:López}
Address: ${3:Main Street 1234}
User name: ${4:$TM_FULLNAME}

当然,嵌套使用完全没有问题
Test: ${1:Nested ${2:Placeholder}}
区域的正则用法:

Original: ${1:Hey, Joe!}
Transformation: ${1/./=/g}
# Output:
      Original: Hey, Joe!
Transformation: =========

三个/中第一个区间为正则,第二个区间为要替换的内容,

i 不区分大小写
g 替换所有匹配
m 多行匹配
Transformation: ${1/^(\w)|(?:_(\w))/(?1\u$1:)(?2 \u$2:)/g}
      Original: ${1:text_in_snail_case}
# Output:
Transformation: Text In Snail Case
      Original: text_in_snail_case

这两个区域内容可以根据所填写的规则动态的改变。你也可以使用前面说过的系统变量。

# In file MyModule.js:
Transformation: ${TM_FILENAME/(\w+)\.js/\1/g}
# Output:
Transformation: MyModule

comletions

当我们在sublime中编写代码时, 经常能看到很多提示和,即我们经常说的自动补全,当每个字符在变化时, 自动补全的内容也会发生改变。
我们也可以自己进行编写`sublime-completions`文件 

{
   "scope": "text.html - source - meta.tag, punctuation.definition.tag.begin",

   "completions":
   [
      { "trigger": "a", "contents": "<a href=\"$1\">$0</a>" },
      { "trigger": "abbr\t<abbr>", "contents": "<abbr>$0</abbr>" },
      { "trigger": "acronym", "contents": "<acronym>$0</acronym>" }
   ]
}

这里介绍一些自动补全的编写,和snippets一样,可以使用$n来进行定位,补全后按tab按会在相应位置停留,n代表开始到按tab的次数。
在trigger中加上\t就可以实现分层效果,说不清楚,上图

{
    "scope": "text.html - source - meta.tag, punctuation.definition.tag.begin",
    "completions":
    [
        {"trigger": "fuc\tk", "contents": "<fuck class=\"${1:fuck}\">${0:fuck}</fuck>"},
    ]
}

上图中fuck中间加入了\t


示例1

他会在我们敲了fuc后进行触发,并将\t后的提示以灰色的形式显示在右边

注意: 如果要出现$请使用\$,需要进行转义

scope

在snippets和completions中都有一个scope的配置项,顾名思义,就是这些snippets和completions在哪些各类的文件中会生效

sublime文档地址:http://docs.sublimetext.info/en/latest/index.html

上一篇 下一篇

猜你喜欢

热点阅读