Sublime Text 完整設定教學:客製化你的專屬編輯器 – wiki词典

Sublime Text 完整設定教學:客製化你的專屬編輯器

Sublime Text 是一款廣受開發者喜愛的程式碼編輯器,以其輕巧、快速且高度可擴充的特性聞名。透過客製化設定,你可以將 Sublime Text 打造成一個完全符合個人習慣的開發利器,大幅提升工作效率。本教學將帶你一步步完成 Sublime Text 的完整設定,從基礎配置到進階技巧,讓你打造出專屬於你的編輯器。

1. 認識設定檔:JSON 的天下

Sublime Text 的所有設定都是透過 JSON (JavaScript Object Notation) 檔案來管理的。理解設定檔的層級結構至關重要:

  • Default 設定檔: 這是 Sublime Text 內建的預設設定。請絕對不要直接修改這些檔案,因為軟體更新時會覆蓋你的變更。
  • User 設定檔: 這是你放置所有個人化設定的地方。這裡的設定會覆寫 Default 設定。
  • 專案 (Project) 設定檔: 針對特定專案的設定。
  • 語法 (Syntax-Specific) 設定檔: 針對特定檔案類型 (如 Python、JavaScript) 的設定。

你可以透過功能表 Preferences > Settings 來開啟設定檔。左邊是唯讀的 Default 設定,右邊是可編輯的 User 設定 (Preferences.sublime-settings)。

2. 基礎設定:打造舒適的編輯環境

打開你的 User 設定檔 (Preferences > Settings),我們來加入一些常用的基礎設定。這是一個 JSON 檔案,所有設定都應寫在一個大括號 {} 內。

json
{
"font_size": 14,
"theme": "Adaptive.sublime-theme",
"color_scheme": "Mariana.sublime-color-scheme",
"tab_size": 4,
"translate_tabs_to_spaces": true,
"word_wrap": true,
"ignored_packages":
[
"Vintage"
]
}

  • "font_size": 調整編輯器中的字體大小。
  • "theme": 控制 UI 的外觀,如分頁、側邊欄等。
  • "color_scheme": 決定語法高亮的配色方案。
  • "tab_size": 設定一個 Tab 的寬度等於多少個空白。
  • "translate_tabs_to_spaces": 按下 Tab 鍵時,自動轉換為空白。
  • "word_wrap": 是否自動換行。
  • "ignored_packages": 禁用指定的套件,這裡我們禁用模擬 Vim 操作的 “Vintage” 套件。

3. Package Control:擴充功能的起點

Package Control 是 Sublime Text 的套件管理器,讓你能輕鬆地搜尋、安裝、更新和移除各種強大的擴充套件。

安裝 Package Control:

  1. 開啟命令面板 (Command Palette):
    • Windows/Linux: Ctrl+Shift+P
    • macOS: Cmd+Shift+P
  2. 輸入 Install Package Control 並按下 Enter
  3. 安裝完成後,系統會跳出成功訊息。建議重新啟動 Sublime Text。

4. 安裝實用套件

安裝好 Package Control 後,我們來安裝一些必備的套件:

  1. 開啟命令面板 (Ctrl+Shift+PCmd+Shift+P)。
  2. 輸入 Package Control: Install Package 並按下 Enter
  3. 在跳出的列表中輸入你想要的套件名稱,然後選擇並安裝。

推薦套件清單:

  • SideBarEnhancements: 增強側邊欄的功能,提供更多右鍵選單選項。
  • Emmet: 前端開發神器,能用縮寫快速產生 HTML 和 CSS 程式碼。
  • BracketHighlighter: 高亮顯示成對的括號、引號和標籤,讓程式碼結構更清晰。
  • A File Icon: 為側邊欄的檔案和資料夾顯示對應的圖示,增加辨識度。
  • GitGutter: 在編輯器中直接顯示 Git 的修改狀態 (新增、修改、刪除)。
  • ConvertToUTF8: 解決中文亂碼問題,自動轉換檔案編碼為 UTF-8。

5. 自訂快捷鍵

為常用功能設定專屬快捷鍵,可以讓你的雙手盡可能地停留在鍵盤上。

  1. 前往 Preferences > Key Bindings
  2. 左邊是預設快捷鍵,右邊是你的自訂快捷鍵檔案 (Default (<platform>).sublime-keymap)。
  3. 在右邊的檔案中加入你的設定。

範例:設定存檔所有檔案的快捷鍵為 Alt+S

json
[
{ "keys": ["alt+s"], "command": "save_all" }
]

6. 自訂程式碼片段 (Snippets)

Snippets 是預設的程式碼模板,可以讓你用一個關鍵字快速插入一大段程式碼。

  1. 前往 Tools > Developer > New Snippet...
  2. <content><![CDATA[...]]></content> 中間填寫你的程式碼模板。$1, $2 是跳格停留的位置。
  3. <tabTrigger> 中設定觸發的關鍵字。
  4. <scope> 中設定此片段適用的檔案類型 (如 source.python)。
  5. 將檔案以 .sublime-snippet 為副檔名,儲存在 Packages/User/ 目錄下。

範例:HTML Div 程式碼片段

“`xml

<![CDATA[

$0

]]>
div
text.html
HTML Div with Class

``
在 HTML 檔案中輸入
div然後按下Tab`,就會自動插入上述程式碼。

7. 自訂建置系統 (Build Systems)

建置系統讓你可以直接在 Sublime Text 中執行外部程式,例如編譯 C++ 程式碼或執行 Python 腳本。

  1. 前往 Tools > Build System > New Build System...
  2. 定義你的建置指令。
  3. 將檔案以 .sublime-build 為副檔名,儲存在 Packages/User/ 目錄下。

範例:執行 Python 3 的建置系統

json
{
"cmd": ["python3", "-u", "$file"],
"file_regex": "^[ ]*File \"(...*?)\", line ([0-9]*)",
"selector": "source.python",
"working_dir": "$file_dir"
}

設定好後,在 Python 檔案中按下 Ctrl+B (或 Cmd+B) 即可執行。

結論

透過本教學的引導,你已經掌握了 Sublime Text 的核心客製化技巧。打造一個順手的開發環境需要時間和不斷的調整,鼓勵你多多探索 Package Control 上豐富的套件,並根據自己的需求修改設定。一個好的編輯器,將會是你程式設計道路上最得力的夥伴。

滚动至顶部