##### 插件安裝 需要注意的是，為了避免安裝的目錄亂，直接下載 portbale version 1.安裝插件管理器 ctrl+\` 打開調試窗口，在輸入框內粘貼如下代碼，然后回車即可自動安裝，安裝完成可能需要重啟ST。 import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by) 回車，稍等片刻就好了，會有提示。 2.這樣就可以使用package control 進行插件安裝了，ctrl+shift+p。輸入install package，回車 彈出搜索框：輸入要安裝插件的name，回車就會安裝，安裝的時候，左下角會有 = 左右移動，說明在安裝了，如果沒有任何提示，那說明沒有開始安裝，就要找別的方法了。（太費事了，具體自己到網上搜索方法吧！） >[info] 如果要移除package，c+s+p，輸入remove package…… 3.基礎用戶設置 網上現在的教程都是比較老的，  如圖所示，只有一個settings，沒錯，直接點擊就行了，新窗口，左邊為default設置，是不允許更改的，右邊為user設置，自己可以更改： 我的默認設置： ~~~ { "auto_find_in_selection": true, "bold_folder_labels": true, "color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme", "default_line_ending": "unix", "disable_tab_abbreviations": true, "draw_minimap_border": true, "ensure_newline_at_eof_on_save": true, "fade_fold_buttons": false, "font_face": "Microsoft YaHei Mono", "font_size": 14, "highlight_line": true, "highlight_modified_tabs": true, "ignored_packages": [ "Vintage" ], "save_on_focus_lost": true, "tab_size": 4, "theme": "Default.sublime-theme", "translate_tabs_to_spaces": true, "trim_trailing_white_space_on_save": true, "word_wrap": "true" } ~~~ trim_trailing_white_space_on_save，自動移除行尾多余空格，處女座更安心了。 ensure_newline_at_eof_on_save，文件末尾自動保留一個空行，懂的人自然知道它的用處。 font_face 設置字體。Microsoft YaHei Mono 是一款混合字體，專為代碼優化，看起來很舒服。當然你也可以使用你自己喜歡的字體，或者刪掉本行，使用默認字體。 disable_tab_abbreviations 設置為 true ，禁用 Emmet 的 tab 鍵功能（請使用 ctrl+e），系統自帶的 tab 功能還是可圈可點的。當然你也可以不設置它，以完全使用 Emmet 的 tab 補全功能。 translate_tabs_to_spaces 很明白就是把代碼 tab 對齊轉換為空格對齊，tab_size 配合設置空格數。這個需求因人而異了，不喜歡可以去掉。 draw_minimap_border，用于右側代碼預覽時給所在區域加上邊框，方便識別。 save_on_focus_lost，窗口失焦立即保存文件，嘛嘛再也不用擔心你忘記保存了。 highlight_line，當前行高亮。word_wrap，設置自動換行。 fade_fold_buttons，默認顯示行號右側的代碼段閉合展開三角號。 bold_folder_labels，側邊欄文件夾顯示加粗，區別于文件。 highlight_modified_tabs，高亮未保存文件。 default_line_ending: “unix”, 使用 unix 風格的換行符。 auto_find_in_selection: true ，開啟選中范圍內搜索（而不是整個文檔 4.ChineseLocalization ， 完全漢化插件（不懂英文的福利，我也是在2018年春節前發現的。網上無意中看到的，我的英文還算ok吧，也沒太在意這個插件） 5.Emmet，前端神器 6.SideBarEnhancements ，增強型側邊欄  如上圖打開之后輸入： ~~~ [ // { "keys": ["ctrl+shift+c"], "command": "copy_path" }, //firefox { "keys": ["f1"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe", "extensions":".*" //匹配任何文件類型 } }, //chrome { "keys": ["f2"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe", "extensions":".*" } }, //ie { "keys": ["f3"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "C:\\Program Files\\Internet Explorer\\iexplore.exe", "extensions":".*" } }, //safari { "keys": ["f4"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "C:\\software\\Browser\\Safari\\safari.exe", "extensions":".*" } }, //opera { "keys": ["f5"], "command": "side_bar_files_open_with", "args": { "paths": [], "application": "C:\\software\\Browser\\opera\\opera.exe", "extensions":".*" } } ] ~~~ 7. HTML/CSS/js Prettify 然后找到這個文件文件夾 tools->HTML/CSS/JS Prettify->set prettify preference 修改文件目錄（sublime版本）  修改路徑：  找到這一樣代碼后面添加 vue "allowed_file_extensions": ["htm", "html", "xhtml", "shtml", "xml", "svg", "vue"], 8.ConvertToUTF8 功能：文件轉碼成utf-8 簡介：通過本插件，您可以編輯并保存目前編碼不被 Sublime Text 支持的文件，特別是中日韓用戶使用的 GB2312，GBK，BIG5，EUC-KR，EUC-JP ，ANSI等。ConvertToUTF8 同時支持 Sublime Text 2 和 3。 使用：安裝插件后自動轉換為utf-8格式 9.IMESupport 功能：sublime中文輸入法 簡介：還在糾結 Sublime Text 中文輸入法不能跟隨光標嗎？試試「IMESupport 」這個插件吧！目前只支持 Windows，在搜索等界面不能很好的跟隨光標。 使用：Ctrl + Shift + P →輸入pci →輸入IMESupport →回車 10.最新版sublime主題、字體相關設置： preferences（首選項） -> color（配色方案）->彈出下圖所示，選擇monokai extended就ok了  修改左側邊欄樣式：（繼續往下看，不要著急操作） preferences（首選項） -> theme（主題方案）->彈出下圖所示，選擇Default.sublime-theme  但是這個只是選擇默認樣式，如何修改呢。繼續往下看： >[warning] （默認的配置文件是不允許你修改的，你也找不到的，需要插件來查找和修改） （1）安裝插件 PackageResourceViewer （2）打開 Open Resource （3）找到 Theme - Default，回車 （4）找打 Default.sublime-theme，回車打開 （5）搜索 ‘sidebar_label’ 并且修改找到的第一個（在362行）,添加 ‘ "font.size": 14’，保存即可 其他相關顏色，背景等搜索網絡教程解決吧。 11.為了省去更改側邊欄樣式的問題，直接更改主題是最快的方式，需要安裝相關插件 搜索 theme 可以發現有很多的主題， 網上推薦這個 Afterglow 不錯（可顯示側邊欄小圖標） 改之前的效果：（10-相關操作之后的樣式 + sidebar）  Welcome to Afterglow Theme To activate the theme, add or replace your current theme settings with the code below. 安裝完afterglow之后，會有package control message。關于插件的相關信息，如果要修改需要設置里添加相關信息 ~~~ Settings for Afterglow { "theme": "Afterglow.sublime-theme", "color_scheme": "Packages/Theme - Afterglow/Afterglow.tmTheme" } Settings for Afterglow-blue { "theme": "Afterglow-blue.sublime-theme", "color_scheme": "Packages/Theme - Afterglow/Afterglow.tmTheme" } Settings for Afterglow-magenta { "theme": "Afterglow-magenta.sublime-theme", "color_scheme": "Packages/Theme - Afterglow/Afterglow.tmTheme" } Settings for Afterglow-orange { "theme": "Afterglow-orange.sublime-theme", "color_scheme": "Packages/Theme - Afterglow/Afterglow.tmTheme" } Settings for Afterglow-green { "theme": "Afterglow-green.sublime-theme", "color_scheme": "Packages/Theme - Afterglow/Afterglow.tmTheme" } If you know other settings (height of the tabs, sidebar options, ...), visit this page: https://github.com/YabataDesign/afterglow-theme/blob/master/README.md ~~~ https://github.com/YabataDesign/afterglow-theme/blob/master/README.md 我選擇的主題是：（決定側邊欄的樣式效果）  配色方案是：（決定編輯部分的樣式效果）  由于默認的側邊的樣式效果看不清問，顏色幾乎和背景融為一體，網上好多人說好看，還是那句話，蘿卜白菜各有所愛，關鍵是看不清…… 修改 像 10 中提到的那樣，利用 PackageResourceViewer 插件，修改樣式文件  字體大小有 12,13，他默認是 14 修改font.size 為自己合適的大小 ~~~ // Sidebar entry font size 14 { "class": "sidebar_label", "settings": ["sidebar_size_14"], "font.size": 16, "color": [200, 200, 200] // 03 }, ~~~ ~~~ // 修改文件夾名稱樣式 "parents": [{"class": "tree_row","attributes": ["expandable"]}], 還有 hover，selected 等 自己可以自行配置相關的樣式 ~~~ it's mine.  STATUS BAR label_control 修改下圖部位的樣式（編輯器最下邊文字樣式）   BOTTOM PANEL ICONS - GROUP 2 icon_reverse + icon_wrap 修改下圖中部位樣式  12.YUI Compressor 壓縮JS和CSS文件 快捷鍵： ctrl + b