創建方法: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[ 你需要插入的代碼片段${1:name} ]]> </ content > ???? <!-- 可選:快捷鍵,利用Tab自動補全代碼的功能 --> ???? < tabTrigger >xyzzy</ tabTrigger > ???? <!-- 可選:使用范圍,不填寫代表對所有文件有效。附:source.css和test.html分別對應不同文件。 --> ???? < scope >source.python</ scope > ???? <!-- 可選:在snippet菜單中的顯示說明(支持中文)。如果不定義,菜單則顯示當前文件的文件名。 --> ???? < description >My Fancy Snippet</ description > </ snippet > |
${1:name}表示代碼插入后,光標所停留的位置,可同時插入多個。其中:name為自定義參數(可選)。
${2}表示代碼插入后,按Tab鍵,光標會根據順序跳轉到相應位置(以此類推)。
現在,你應該有了個大致的了解。那我們就開始自己動手編寫一個實例:
< snippet > ????? < content > ????? <![CDATA[ ????? <footer> ?????????? <p>Copyright ? 2008-2012 ${1:bluesdream}.com</p> ?????????? <p>增值電信業務經營許可證 滬B2-${2} <a href="#">滬ICP備號${3}</a></p> ????? </footer> ????? ]]> ????? </ content > ????? < tabTrigger >cft</ tabTrigger > ????? < description >custom-footer</ description > ????? < scope >text.html</ scope > </ snippet > |
創建完畢以后,保存在\Packages\User目錄下(例 X:\Sublime Text 2.0\Data\Packages\User),文件命名為cft-code,后綴名.sublime-snippet。
此時我們打開一個html文件,輸入cft,再按Tab鍵,剛才我們所編寫的代碼段,就插入了進來。并且此時的光標停留在我們所標記的${1}位置處,如果我們再按下Tab,那么光標就跳轉到${2}的位置。由于我們在scope中定義了僅在html文件中使用,所以此時如果我們打開的是css或其他格式的文件,那將無法插入代碼段。
補充:除了利用快捷鍵Tab出代碼之外,我們還能通過菜單來加載,打開Tools > Snippet,選擇Snippet: custom-footer。如果你沒有定義description,那此時便會看到以我們文件名為命名的Snippet: cft-code選項。