利用sublime的snippet功能快速建立程式碼片段，sublimesnippet

利用sublime的snippet功能快速建立程式碼片段，sublimesnippet

在前端開發中我們經常會輸入相同的一些基本代碼，例如常用的jquery引用，bootstrap架構，cssreset等等，如果每次使用時在複製粘貼感覺很麻煩，這裡介紹一種更為簡潔的方法

利用sublime的snippet功能快速建立程式碼片段

開啟Tools->New snippet我們能看到內容

要是沒有一點英語基礎，就有點抓瞎了，今天就來介紹一下如何使用這超級功能

首先簡要介紹一下snippet的組成部分:

• content:其中必須包含<![CDATA[…]]>,否則無法工作, 裡麵包含自己要使用的程式碼片段，這裡頁面上所示的程式碼片段是Hello, this is a snippet. ${1:this}表示獲得程式碼片段後游標首先放在this後面， ${2:snippet}表示按下Tab鍵後游標將從this跳到snippet後面，這些都是為了方便輸入後續代碼。如果你要貼入的程式碼片段是不需要修改的，則可忽略這些
• tabTrigger:用來引發程式碼片段的字元或者字串, 比如在以上例子上, 在編輯視窗輸入hello然後按下tab就會在編輯器輸出Hello, this is a snippet. 這段程式碼片段
• scope: 表示你的程式碼片段會在那種語言環境下啟用, 比如上面代碼定義了source.python, 意思是這段程式碼片段會在python語言環境下啟用.

好了，接下來展示我自己經常使用的程式碼片段

如此設定之後，在html頁面中輸入jquery再按下Tab鍵，即可快速得到你在snippet中的程式碼片段，即

<script src="http://apps.bdimg.com/libs/jquery/1.9.0/jquery.min.js"></script>

怎麼樣，夠快的吧！再也不用敲那麼多代碼了。

css也可如此使用

這是我的pc端cssreset程式碼片段，這樣我只要在css頁面中輸入cssresetpc，再按下Tab鍵即可得到cssreset。

簡直快的不能再快了，你看明白了嗎？