sublimetext – php – scss – susy – jQuery – 我安裝的外掛、設定、同步備份安裝檔

2014-09-29 / JSN / 0 Comments / 1,902 次瀏覽

這裡記錄我在 Sublimetext 3  上面安裝的外掛~

外掛元件

• IMESupport：打中文可以在游標處直接顯示；而不會像預設的在編輯器之外顯示中文。
• JavaScript Completions： JavaScript 輔助片段
• BracketHighlighter：讓你的 { } 有高亮效果
• Alignment：自動對齊功能，例如讓等號自動對齊
• CodeIgniter Snippets：php 的 CodeIgniter 片段
• ColorPicker：色彩選擇器
• DocBlockr：快速編輯註解功能
• Emmet：快速編輯 html 的工具
• jQuery： jQuery片段
• LiveStyle：配合 Chrome 的即時顯示CSS
• SASS Snippets：寫SASS的片段
• Sass：SASS 的支援
• SCSS Snippets：寫SCSS的片段
• SCSS：寫 SCSS 的片段
• Compass：使用Compass的片段
• SideBarEnhancements：擴充側邊欄的功能，豐富一些常用的指令，例如複製、貼上、重新命名、顯示資料夾等等。
• SublimeLinter：偵錯的總裝置，須要先安裝。可以偵錯其他語言，但要額外安裝。
• SublimeLinter-php：擴充偵錯PHP。記得先安裝 SublimeLinter 。
  (103/10/10 今天似乎有更新，在XAMPP已經可以正常使用了，無需做任何設定)
• Susy Snippets：SUSY ONE 的片段。
• Boxy Theme：好看的 Theme。
• SFTP：付費，可試用只是會跳出購買訊息。可以一邊編輯文件，存檔並上傳到FTP。
• SublimeCodeIntel：可以顯示如 php 的結構。
  因為在 HTML 的時候，我需要用 Emmet 快速切版，每次鍵盤一按下就跳出自動完成選單，當按tab就會選到不是自己要的Emmet自動完成，所以我會把 SublimeCodeIntel 的設定修改成只有 PHP 使用。這樣HTML打任何字時才不會跳出惱人的自動完成候選單。
  
  1 2 3 4 5 6 7 8 9

  /*    An array of language names which are enabled. */ "codeintel_enabled_languages": [    "PHP" ],

  
   
• TortoiseGIT：在Windows可以使用快捷鍵，呼叫 Git commit 指令。滿方便的。
  
  1 2 3 4 5 6 7

  {     // Auto close update dialog when no errors, conflicts and merges     "autoCloseUpdateDialog": false,     "tortoiseproc_path": "C:\\Program Files\\TortoiseGit\\bin\\TortoiseGitProc.exe" //你的 TortoiseGit 執行位置 }

• ASCII Decorator：可以產生英文大圖字，當程式碼很長的時候用在編輯器右側 minimap 可以很明顯的標註位置。例如…
  
  
  1 2 3 4

  // 先打英文字 // 反白後，按下 ctrl+shift+p 選擇 ASCII Decorator: Font Selector 可以選擇你要的字型

• phpfmt：自動格式化 php。我的設定
  
  1 2 3 4 5 6 7 8 9 10 11 12 13 14

  { "autocomplete": true, "disable_auto_align": true, "format_on_save": true, "merge_else_if": true, "php_bin": "C:/xampp/php/php.exe", "psr1": false, "psr2": true, "smart_linebreak_after_curly": true, "visibility_order": true, "yoda": false }

• Colorsublime：快速查看 package control 上已經發佈的 color scheme。
• ColorSchemeEditor：使用 Shift + F12 編輯你當前 Color Scheme 的色彩。PHP 用戶有個推薦的色彩樣式，點我。

設定

讓正在編輯的程式碼區塊左側，從開始到結束之間的側邊線高亮；如果體有替換主體(theme)，注意有些主題的顏色不明顯喔。

快捷鍵

• Ctrl + K, Ctrl + V：可以跳出黏貼板
• Ctrl+Shift+[ 或 Ctrl+Shift+] ：摺疊代碼
• Ctrl+k, Ctrl+1/2/3/… 可折疊階層代碼
• 若有安裝 Emmet,
  Ctrl+Shift+U 改變上層HTML標籤
  Ctrl+Shift+G 在上一層加入HTML包圍起來

多台主機同步方法

注意：我是下載免安裝的版本。路徑不確定跟安裝板是否相同。

第一台主機，先製作同步到Dropbox

複製『Data\Packages\User』到『你的Dropbox某個資料夾』。

這裡其實只複製記錄你有那些安裝包，並不是直接複製安裝包的安裝檔。因為直接複製安裝檔，在不同主機同步時會有可能發生相容問題(如同時 Windowx、Mac、Linux….)，所以應該由ST辨識有哪些安裝名稱，由ST自動去下載你該台主機適合的版本或解決相容問題。

第二台主機，取得個人設定與安裝包設定檔

直接複製『你的Dropbox某個資料夾\User』取代掉『Data\Packages\User』，然後重新開ST就可以了。如果你的Sublimetext 3 是剛下載下來，記得要先去安裝 Package Control喔，這樣重開ST的時候才會偵測並下載到你的編輯器裡。