首頁 > 文章 > 開發工具 > 如何在Sublime Text中加入程式碼片段

如何在Sublime Text中加入程式碼片段

藏色散人轉載: 2019-09-30 15:02:143198瀏覽

下面由sublime使用教學欄位來介紹在Sublime Text中加入程式碼片段的方法，希望對需要的朋友有幫助！

我們在寫程式碼的時候，總是會遇到一些需要重複使用的程式碼片段。這時候就需要反覆的複製和貼上，大大影響效率。我們利用Sublime Text的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> -->
    <!-- <description>description</description> -->
</snippet>

其中，content中由CDATA包裹起來的部分是我們要插入的程式碼片段，可選。

tabTrigger是我們tab鍵觸發的自動補全程式碼功能的一個名字，可選。

scope，可選，使用範圍，不填寫代表對所有文件有效。附：source.css和test.html分別對應不同檔案。

description，可選，在snippet選單中的顯示說明（支援中文）。如果不定義，選單則顯示目前檔案的檔案名稱。

${1:this}表示程式碼插入後，遊標所停留的位置，可同時插入多個。其中:this為自訂參數（可選）。

${2}表示程式碼插入後，按Tab鍵，遊標會依照順序跳到對應位置（以此類推）。

現在，你應該有了大致的了解。那我們就開始自己動手寫一個實例。我們都知道，再Sublime中，輸入！或html:5再按tab鍵，可以自動補全HTML結構，但這個結果相對很簡單，我自己擴充了它的結果內容，新增了幾個mate標籤，增加了頁面描述。

<snippet>
    <content><![CDATA[
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <meta name="Generator" content="Sublime Text3">
    <meta name="Author" content="dunizb">
    <meta name="website" content="http://www.mybry.com">
    <meta name="Description" content="读你，这世间唯有梦想和好姑娘不可辜负~~">
    <link type="image/x-icon" rel="shortcut icon" href="image/favicon.ico" />
    <script type="text/javascript">
        ${1:}
    </script>
<body>
    ${2:这是html内容}
</body>
</html>
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>hjs</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <!-- <scope>source.python</scope> -->
    <description>custom-html</description>
</snippet>

然後儲存程式碼片段，儲存到Sublime Text3DataPackagesUser下面，取個名字

如何在Sublime Text中加入程式碼片段

就這樣，在HTML頁面中輸入hjs tab，就可以自動補全這一系列程式碼了。

以上是如何在Sublime Text中加入程式碼片段的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文轉載於：segmentfault.com。如有侵權，請聯絡admin@php.cn刪除

上一篇：sublime設定自己的快速鍵下一篇：sublime設定自己的快速鍵

看更多