Sublime Text3 自定義快速生成代碼

轉載自:

https://blog.csdn.net/lihchweb/article/details/77883101 


依次打開 Tools > Developer(開發者選項) > 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 去定義如何觸發代碼段
    <!-- <tabTrigger>hello</tabTrigger> -->
    //官方給出了這樣的例子:<tabTrigger>hello</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    //選項: 爲該代碼段設置一個能夠觸發代碼段的區域。
    <!-- <scope>source.python</scope> -->
    //官方例子:<scope>source.python</scope> 在phthon文件裏觸發
</snippet>

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13

我們只需要把定義的代碼段寫在 ![CDATA[ ]] 裏面即可。

這裏${1: } 表示的是生成代碼段之後光標定位的位置 , 如果你有多個${2: } ,數字依次往下排,摁Tab/Enter光標可以切換到下一個區域。

下面是一個 用 cl 觸發 console.log() 並且在()裏輸入代碼的示例。

<snippet>
    <content>
        <![CDATA[
            console.log( ${1: });
        ]]>
    </content>

    <tabTrigger>cl</tabTrigger>

    <scope>source.js</scope>
</snippet>

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12

設置完成 Ctrl + s, 保存,這裏我們把這個文件保存爲: console.sublime-snippet

sumlime Text會默認把該文件存放在 /Packages/User 目錄下。

文件必須以.sublime-snippet爲擴展名,否則Sublime Text將不能識別該代碼段。

這樣寫js的時候輸入 cl ,就會出現如下提示:
這裏寫圖片描述

再敲下 Tab/Enter 就可以了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章