手把手教你寫Sublime中的Snippet


Sublime Text號稱最性感的編輯器, 并且越來越多人使用, 美觀, 高效

關于如何使用Sublime text可以參考我的另一篇文章, 相信你會喜歡上的..
Sublime Text 2使用心得

現(xiàn)在介紹一下Snippet, Snippets are smart templates that will insert text for you and adapt it to their context. Snippet 是插入到文本中的智能模板并使這段文本適當當前代碼環(huán)境. 程序員總是會不斷的重寫一些簡單的代碼片段, 這種工作乏味/無聊, 而Snippet的出現(xiàn)會讓Code更加高效.

1. Snippe創(chuàng)建,存儲和格式


(這里snippet稱作代碼片段)

Snippet可以存儲在任何的文件夾中, 并且以.sublime-snippet為文件擴展名, 默認是存儲在.sublime-snippet文件夾下.

Snippet文件是以.sublime-snippet為擴展的XML文件, 可以命名為XXX.sublime-snippet, 創(chuàng)建自己的snippet的方式為菜單欄Tools | New Snippet..

下面看一下新建的文件格式:

<snippet>
    <content><![CDATA[
Hello, ${1:this} is a ${2:snippet}.
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <!-- <tabTrigger>hello</tabTrigger> -->
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <!-- <scope>source.python</scope> -->
</snippet>

為了方便理解簡化以上代碼:

<snippet>
    <content><![CDATA[Type your snippet here]]></content>
    <!-- Optional: Tab trigger to activate the snippet -->
    <tabTrigger>hello</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>

簡要介紹一下snippet四個組成部分:

  • content:其中必須包含<![CDATA[…]]>,否則無法工作, Type your snippet here用來寫你自己的代碼片段
  • tabTrigger:用來引發(fā)代碼片段的字符或者字符串, 比如在以上例子上, 在編輯窗口輸入hello然后按下tab就會在編輯器輸出Type your snippet here這段代碼片段
  • scope: 表示你的代碼片段會在那種語言環(huán)境下激活, 比如上面代碼定義了source.python, 意思是這段代碼片段會在python語言環(huán)境下激活.
  • description :展示代碼片段的描述, 如果不寫的話, 默認使用代碼片段的文件名作為描述

2. snippet環(huán)境變量


列舉一下可能用到的環(huán)境變量, 這些環(huán)境變量是在Sublime中已經(jīng)預定義的.

環(huán)境變量名 描述
$TM_FILENAME 用戶文件名
$TM_FILEPATH 用戶文件全路徑
$TM_FULLNAME 用戶的用戶名
$TM_LINE_INDEX 插入多少列, 默認為0
$TM_LINE_NUMBER 一個snippet插入多少行
$TM_SOFT_TABS 如果設置translate_tabs_to_spaces : true 則為Yes
$TM_TAB_SIZE 每個Tab包含幾個空格

同一通過下面的代碼片段進行驗證:

<snippet>
   <content><![CDATA[
=================================
$TM_FILENAME   用戶文件名
$TM_FILEPATH   用戶文件全路徑
$TM_FULLNAME    用戶的用戶名
$TM_LINE_INDEX   插入多少列, 默認為0
$TM_LINE_NUMBER   一個snippet插入多少行
$TM_SOFT_TABS  如果設置translate_tabs_to_spaces : true 則為Yes
$TM_TAB_SIZE   每個Tab包含幾個空格
=================================
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>hello</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.python</scope>
</snippet>

驗證方式 : 保存自定義snippet,在python文件夾下輸入hello按下tab

3. snippet Fields


設置Fields, 可以通過tab鍵循環(huán)的改變代碼片段的一些值

<snippet>
   <content><![CDATA[
=================================
First Name: $1
Second Name: $2
Address: $3
=================================
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>hello</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.python</scope>
</snippet>

驗證方式, 在python文件夾下, 輸入hello按下tab, 會出現(xiàn)已經(jīng)定義的代碼片段, 不停的按下tab會發(fā)現(xiàn)輸入光標在$1, $2, $3的位置跳轉(zhuǎn), 跳轉(zhuǎn)順序由數(shù)字由小到大決定, Shift+Tab可以進行向上跳轉(zhuǎn), 可以通過Esc結(jié)束跳轉(zhuǎn)

4. snippet Mirrored Fields


設置snippet鏡像區(qū)域,會使相同編號的位置同時進行編輯

<snippet>
   <content><![CDATA[
=================================
First Name: $1
Second Name: $1
Address: $1
=================================
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>hello</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.python</scope>
</snippet>

驗證方法: 在python文件中, 輸入hello按下tab,出現(xiàn)代碼片段,會出現(xiàn)三行同行編輯的光標, 這時進行編輯可以同時進行三行相同的編輯

5. snippet Placeholders


snippet 占位符含義類似于python的默認參數(shù), 通過對Field做出一點修改, 可以定義Field的默認值, 并且可以通過tab鍵可以對不同的默認值進行修改

<snippet>
   <content><![CDATA[
=================================
First Name: ${1:Guillermo}
Second Name: ${2:López}
Address: ${3:Main Street 1234}
User name: $1
Environment Variable : ${4:$TM_FILEPATH }  #可以設置默認占位符為環(huán)境變量
Test: ${5:Nested ${6:Placeholder}}
=================================
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>hello</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.python</scope>
</snippet>

驗證方式: 在pyton文件中輸入hello,然后按下tab, 輸入代碼片段后, 兩個$1的field可以同時修改默認值, 然后繼續(xù)按下tab鍵可以修改$2的默認值..., 還可以占位符設置嵌套

寫到這里基本上大家都應該可以根據(jù)需求編寫簡單的snippet了, 恭喜你..

6. snippet Substitutions


高級應用可以使用Perl的正則表達式

最后送上簡單的python的snippet

<snippet>
    <content><![CDATA[
"""

文檔注釋

Args : 
    ${1}:

Returns : 
    ${2}:

Raises : 
    ${3}:

"""
]]></content>
    <tabTrigger>"""</tabTrigger>
    <scope>source.python</scope>
    <description>Documentation Comments</description>
</snippet>

###
<snippet>
    <content><![CDATA[def ${1:foo}():
    doc = "${2:The $1 property.}"
    def fget(self):
        ${3:return self._$1}
    def fset(self, value):
        ${4:self._$1 = value}
    def fdel(self):
        ${5:del self._$1}
    return locals()
$1 = property(**$1())$0]]></content>
    <tabTrigger>property</tabTrigger>
    <scope>source.python</scope>
    <description>New Property</description>
</snippet>

7. 拓展閱讀和參考鏈接


Snippets
Syntax Definitions
Perl Regular Expression Syntax
Boost-Extended Format String Syntax

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容