sublime text 3

1. 安裝與設定

  1. 請至官網下載:https://www.sublimetext.com/3
  2. 安裝套件管理程式
    1. 下載 Package Control.sublime-package 至 Installed Packages/ 
      防毒與防火牆有時會阻擋連線
    2. 打開控制台列: 從選單的View > Show Console。或是按快捷鍵「ctrl+`」
    3. 貼上這個網站提供的的安裝碼: https://packagecontrol.io/installation
    4. 試著打開命令列: 按快捷鍵ctrl+shift+p。從選單的Tools > Command Palette。
  3. 安裝套件
    打開命令列(按快捷鍵ctrl+shift+p。從選單的Tools > Command Palette。),輸入install,找到"Package Control: Install Package",然後按下Enter鍵。接著輸入要安裝的套件名稱,再按下Enter鍵就會進行安裝。
    ​以下為基本需要安裝的套件:
    1. ChineseLocalizations: 選單中文介面,有日語、簡中、繁中三種語言。
      「Help/language」選擇 語系
    2. ConvertToUTF8: 編輯或儲存GBK或BIG5編碼的文件,或是互轉編碼為UTF-8。
  4. 前端(Javascript/HTML)工程師會用到的幾個套件:
    1. Emmet: 用簡碼的方式輸入HTML與CSS碼,以前叫Zen Coding。搭配小抄學習會比較快。
    2. jQuery: 針對jQuery程式碼提供較佳的高亮度函式顯示與程式片段。
    3. SublimeCodeIntel: 智慧型語法、函式自動完成的套件,支援多種語言如JavaScript, Python, HTML, Ruby, Python3, XML, HTML5, Perl, CSS, Node.js, PHP等等。
    4. JsFormat: 格式化Javascript/JSON程式碼的套件。
    5. SublimeLinter: 檢查程式的基礎套件,主要用來檢查程式碼的語法問題,支援多種語言如Javascript, CSS等等。
      不過只裝這個是沒有作用的,要另外依照不同程式碼安裝相對應的套件,例如下面介紹的 SublimeLinter-php。
    6. SublimeLinter-php:PHP 錯誤檢查工具,要先安裝 SublimeLinter 以及 PATH 有 php 執行檔的路徑才會有作用
      https://packagecontrol.io/packages/SublimeLinter-php
  5. 其他推薦的套件:
    1. SideBarEnhancements: 加強側邊列(檔案與資料夾)功能的套件。
    2. BracketHighlighter: 把各種括號符號、標記特別高亮度顯示出來。
    3. Color Highlighter: 有顏色碼的地方用顏色標示出來。
      「設定/Package Settings → Color Highlighter → Settings – User」
      {
      "ha_style": "filled"
      }

       

    4. Alignment
    5. DocBlockr:自動產生區塊是註解的工具,可用在 JS, CSS, PHP, CoffeeScript, Actionscript, C & C++ 等等
    6. Color Picker:在CSS檔案中直接開啟色盤選色。按「ctrl + shift + c」,不過跟ConvertToUTF8的快捷鍵打到,要修改
    7. Bootstrap 3 Snippets :使用 Sublime Text Snippets 快速編輯 Bootstrap 3 的 HTML 代碼
    8. TrailingSpaces:這款插件能高亮顯示多餘的空格和Tab
  6. 參考與推薦網站
    1. Sublime Text 手冊
    2. Sublime Text 3 Mac 指南
    3. GETTING STARTED WITH SUBLIME TEXT 3: 25 TIPS, TRICKS, AND SHORTCUTS
    4. Sublime Text Unofficial Documentation
    5. 下載