How to Add Custom Code Snippets to Atom:Atom 是 GitHub 開發的 Web 開發領域非常流行的代碼編輯器; Atom 沒有很多包,而是它的每個部分都可以由用戶自定義。

Atom 的代碼片段功能可用於簡化您的編碼工作流程並減少重複性任務。本文將向您展示如何使用 Atom 的內置代碼片段以及如何創建您自己的自定義代碼片段。

如何向 Atom 添加自定義代碼片段

查找配置文件

要將您自己的自定義代碼片段添加到 Atom,首先您需要找到名為 snippets.cson 的配置文件,它是一個 CoffeeScript Object Notation 文件。單擊頂部欄中的“文件”>“片段…”菜單,Atom 將打開 snippets.cson 文件,您可以在其中添加自己的自定義片段。

找到合適的範圍

範圍的名稱 片段的名稱 前綴,將用作片段的句柄 片段的主體

要找到您需要的範圍,請單擊頂部菜單欄中的“文件”>“設置”菜單,然後在“設置”中找到“包”選項卡。在這裡,搜索您需要的範圍,例如,如果您想將代碼片段添加到 HTML 語言,請在搜索欄中輸入 HTML。

創建單行代碼片段

要創建單行代碼片段,您需要將片段的範圍、名稱、前綴和主體添加到 snippets.cson 文件中,使用以下語法:

創建多行代碼片段

多行代碼片段使用了一些不同的語法。您需要添加與單行代碼片段相同的數據-範圍、名稱、前綴和代碼片段的主體。

添加製表位

您可以進一步通過向代碼片段正文添加製表位來促進自定義代碼片段的使用。製表位指示用戶可以使用 Tab 鍵導航的位置。使用製表位,您可以節省文本內導航所需的時間。您可以使用 $1、$2、$3、… 語法添加製表位。 Atom 會將光標定位到它找到 $1 的位置,然後您可以使用 Tab 鍵跳轉到 $2,然後跳轉到 $3,依此類推。

添加可選參數

Atom 允許您可以使用可選參數向代碼段添加額外信息。如果其他人也使用您的編輯器並且您想讓他們知道代碼段的用途,或者如果您的自定義代碼段過於復雜以至於需要向它們添加註釋,則此功能會很有用。

為什麼代碼片段很有用

當我第一次開始學習編碼時,我使用的第一個代碼片段是 Ctrl + !並輸入。 (我懷疑有人記住瞭如何寫這個。)這很酷,我覺得自己像個代碼忍者。 (PS:如果您不想閱讀背景故事並想直接進入教程,請直接進入……)

當我開始進一步探索編碼時,我了解了 VSCode 擴展,這些擴展使編碼成為可能更快,尤其是代碼片段,並反復下載它們。一切都很好,但我開始在我的項目中更頻繁地使用框架和庫。所以我嘗試學習如何將文檔鏈接到包以及如何使用個性化的 CSS 重置和變量。

FAQ

如何在 VS Code 中添加 C 代碼片段?

突出顯示要為其創建片段的代碼,按 ctrl + shift + P,在命令面板中鍵入“create snippet”,然後按 ENTER。輸入片段名稱、片段的快捷方式和片段的描述。您現在可以開始了。

什麼是自定義代碼片段?

代碼片段是一個編程術語,指的是一小部分可重複使用的源代碼、機器代碼、或文字。片段可幫助程序員減少在編碼時輸入重複信息所需的時間。代碼片段是大多數文本編輯器、代碼編輯器和 IDE 的一項功能。

By Maxwell Gaven

我在 IT 行業工作了 7 年。 觀察 IT 行業的不斷變化很有趣。 IT 是我的工作、愛好和生活。