整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          sublime安裝html補全插件

          .下載一個sublime text(sublime編輯器安裝簡單,這里不做介紹)

          2.Sublime Text導入Package Control

          在菜單欄中找到preferences選項, 找到package contor雙擊進入,若是沒有package control這一項,package 安裝方法如下:

          方法1:在線安裝,快捷鍵 Ctrl + ~,輸入如下的代碼:

          import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')

          安裝完畢后重啟軟件即可在preferences中看到package contor選項。

          ps:快捷鍵Ctrl + Shift + P 然后輸入Install Package看是否可以調出來Install Package驗證下安裝是否成功。

          方法2:離線安裝,提前下載好Package Control的安裝包,將該安裝包替換到Sublime Text的相關路徑下即可,這里有兩個路徑,經驗證放置到其中任意一處均可。

          路徑1:打開Sublime Text ,點擊PreFerences --> Browse Packages,進入一個文件夾后返回該文件夾的上一級“Sublime Text”,找到一個“Installed Packages”文件夾(如果沒有該文件夾則創建個新的),將下載好的Package Control的安裝包放到“Installed Packages”文件夾下即可。

          路徑2:Sublime Text 的安裝路徑,“Sublime Text \Pristine Packages\”文件夾下

          3.安裝emmet

          1)重啟sublime text,點擊preferences,點擊package control。

          2)在彈出的窗口輸入install,雙擊install package。

          3)輸入emmet,點擊安裝。

          4)安裝完后重啟sublime頭部補全完成。

          者:Lucida

          原文鏈接:http://lucida.me/blog/sublime-text-complete-guide

          # 摘要(Abstract)

          本文系統全面的介紹了 Sublime Text,旨在成為最優秀的 Sublime Text 中文教程。

          # 更新記錄

          1.2014/09/27:完成初稿

          2.2014/09/28:

          更正打開控制臺的快捷鍵為 Ctrl + `

          更正全局替換的快捷鍵為 Ctrl + Alt + Enter

          3.2016/09/15:作者已全面轉向 Visual Studio Code

          # 前言(Prologue)

          Sublime Text 是一款跨平臺代碼編輯器(Code Editor),從最初的 Sublime Text 1.0,到現在的 Sublime Text 3.0,Sublime Text 從一個不知名的編輯器演變到現在幾乎是各平臺首選的 GUI 編輯器。而這樣優秀的編輯器卻沒有一個靠譜的中文教程,所以我試圖通過本文彌補這個缺陷。

          # 編輯器的選擇(Editor Choices)

          從初學編程到現在,我用過的編輯器有 EditPlus、UltraEdit、Notepad++、Vim、TextMate 和 Sublime Text,如果讓我從中推薦,我會毫不猶豫的推薦 Vim 和 Sublime Text,原因有下面幾點:

          1.跨平臺:Vim 和 Sublime Text 均為跨平臺編輯器(在 Linux、OS X 和 Windows 下均可使用)。作為一個程序員,切換系統是常有的事情,為了減少重復學習,使用一個跨平臺的編輯器是很有必要的。

          2.可擴展:Vim 和 Sublime Text 都是可擴展的(Extensible),并包含大量實用插件,我們可以通過安裝自己領域的插件來成倍提高工作效率。

          3.互補:Vim 和 Sublime Text 分別是命令行環境(CLI)和圖形界面環境(GUI)下的最佳選擇,同時使用兩者會大大提高工作效率。

          # 個人背景(Personal Background)

          我是一名非常典型的程序員:平時工作主要在 Linux 環境下使用 Java 和 Python,偶爾會用 HTML+CSS+JavaScript 編寫網頁;業余時會在 Windows 環境編寫一些 C# 程序(包括控制臺程序(Console Application)和移動應用(Mobile App),也會玩一些非主流語言(比如 Haskell,ML 和 Ruby 等)以拓展見識。

          所以這篇文章會我的個人工作內容為主要使用場景(Scenario),盡管無法覆蓋到所有的使用場景,但我認為依然可以覆蓋到絕大部分,如果您認為我遺漏了什么內容,請在文章下面回復,我會盡量更新。

          # 本文風格(Writing Style)

          受益于 K&R C 的寫作風格,我傾向于以實際案例來講解 Sublime Text 的功能,所以本文中的例子均源于我在實際開發時遇到的問題。

          此外,把本文會使用大量動畫(GIF)演示 Sublime Text 的編輯功能,因為我發現圖片難以演示完整的編輯流程(Workflow),而視頻又過于重量級。本文的GIF動畫均使用 ScreenToGif 進行錄制。

          # 編輯器(Editor) vs 集成開發環境(Integrated Development Environment,下文簡稱 IDE)

          我經常看到一些程序員拿編輯器和 IDE 進行比較,諸如 Vim 比 Eclipse 強大或是 Visual Studio 太慢不如 Notepad++ 好使之類的討論比比皆是,個人認為這些討論沒有意義,因為編輯器和 IDE 根本是面向兩種不同使用場景的工具:

          1.編輯器面向無語義的純文本,不涉及領域邏輯,因此速度快體積小,適合編寫單獨的配置文件和動態語言腳本(Shell、Python 和 Ruby 等)。

          2.IDE 面向有語義的代碼,會涉及到大量領域邏輯,因此速度偏慢體積龐大,適合編寫靜態語言項目(Java、C++ 和 C# 等)。

          我認為應當使用正確的工具去做有價值的事情,并把效率最大化,所以我會用 Eclipse 編寫 Java 項目,用 Vim 編寫Shell,用 Sublime Text 編寫 JavaScript/HTML/Python,用 Visual Studio 編寫C#。

          前言到此結束,下面進入正題。

          # 安裝(Installation)



          Sublime Text 官方網站 提供了 Sublime Text 各系統各版本的下載,目前Sublime Text 的最新版本是 Sublime Text 3。這里以 Windows 版本的 Sublime Text 安裝為例。

          注意在安裝時勾選 Add to explorer context menu,這樣在右鍵單擊文件時就可以直接使用 Sublime Text 打開。

          # 添加 Sublime Text 到環境變量

          使用 Win + R 運行 sysdm.cpl 打開 “系統屬性”。

          然后在 “高級” 選項卡里選擇 “環境變量”,編輯 “Path”,增加 Sublime Text 的安裝目錄(例如 D:\Program Files\Sublime Text 3)。

          接下來你就可以在命令行里面利用 subl 命令直接使用 Sublime Text 了:

          subl file :: 使用 Sublime Text 打開 file 文件
          subl folder :: 使用 Sublime Text 打開 folder 文件夾
          subl . :: 使用 Sublime Text 當前文件夾

          # 安裝 Package Control

          前文提到 Sublime Text 支持大量插件,如何找到并管理這些插件就成了一個問題,Package Control 正是為了解決這個問題而出現的,利用它我們可以很方便的瀏覽、安裝和卸載 Sublime Text 中的插件。


          # 安裝 Package Control

          前文提到 Sublime Text 支持大量插件,如何找到并管理這些插件就成了一個問題,Package Control 正是為了解決這個問題而出現的,利用它我們可以很方便的瀏覽、安裝和卸載 Sublime Text 中的插件。

          進入 Package Control 的 官網,里面有詳細的 安裝教程。Package Control 支持 Sublime Text 2 和 3,本文只給出 3 的安裝流程:

          1.使用 Ctrl + ` 打開 Sublime Text 控制臺。

          2.將下面的代碼粘貼到控制臺里:


          import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; 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://sublime.wbond.net/' + 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)

          3.等待 Package Control 安裝完成。之后使用 Ctrl + Shift + P 打開命令板,輸入 PC 應出現 Package Control:

          成功安裝 Package Control 之后,我們就可以方便的安裝使用 Sublime Text 的各種插件:

          # 購買(Purchase)

          Sublime Text 是一個收費閉源軟件,這在一定程度上成為了我支持 Sublime Text 的理由(我心中的軟件靠譜程度:免費開源 << 免費閉源 < 收費開源 < 收費閉源):在 這里 購買。

          不過不購買 Sublime Text 也可以 “正常” 使用它,只是 Sublime Text 會時不時的彈出一個對話框提醒你購買,此外窗口處會有一個很屌絲很 low 逼的 (UNREGISTERED)。(在高頻操作下,一般 20 分鐘提示一次,個人認為算是很厚道了)

          也許不少人會覺著 Sublime Text 70 刀的價格太貴,但相比它的功能和帶來的效率提升,70 刀真的不值一提,如果你不方便使用 Paypal 付款可以郵件聯系我,你支付寶給我打款然后我幫你付款,價格按當日匯率折算(450 元左右)。

          概覽(Tour)

          # 基本概念(Basic Concepts)

          Sublime Text 的界面如下:

          1.標簽(Tab):無需介紹。

          2.編輯區(Editing Area):無需介紹。

          3.側欄(Side Bar):包含當前打開的文件以及文件夾視圖。

          4.縮略圖(Minimap):如其名。

          5.命令板(Command Palette):Sublime Text 的操作中心,它使得我們基本可以脫離鼠標和菜單欄進行操作。

          6.控制臺(Console):使用 Ctrl + ` 調出,它既是一個標準的 Python REPL,也可以直接對 Sublime Text 進行配置。

          7.狀態欄(Status Bar):顯示當前行號、當前語言和Tab格式等信息。

          # 配置(Settings)

          與其他 GUI 環境下的編輯器不同,Sublime Text 并沒有一個專門的配置界面,與之相反,Sublime Text 使用 JSON 配置文件,例如:

          {
           "font_size": 12,
           "highlight_line": true,
          }

          會將默認字體大小調整為 12,并高亮當前行。


          會將默認字體大小調整為 12,并高亮當前行。

          JSON 配置文件的引入簡化了 Sublime Text 的界面,但也使得配置變的復雜,一般我會到 這里 查看可用的 Sublime Text 配置。

          # 編輯(Editing)

          Sublime Text 的編輯十分人性化——它不像 Vim 那樣反人類(盡管我也用 Vim 但我還是要說 Vim 的快捷鍵設定絕壁連代謝產物都不如),少量的快捷鍵就可以完成絕大多數編輯任務。

          # 基本編輯(Basic Editing)

          ↑↓←→ 就是 ↑↓←→,不是 KJHL,(沒錯我就是在吐槽 Vim,尼瑪設成 WSAD 也比這個強啊),粘貼剪切復制均和系統一致。

          Ctrl + Enter 在當前行下面新增一行然后跳至該行;Ctrl + Shift + Enter 在當前行上面增加一行并跳至該行。

          Ctrl + ←/→ 進行逐詞移動,相應的,Ctrl + Shift + ←/→ 進行逐詞選擇。

          Ctrl + ↑/↓ 移動當前顯示區域,Ctrl + Shift + ↑/↓ 移動當前行。



          # 選擇(Selecting)

          Sublime Text 的一大亮點是支持多重選擇——同時選擇多個區域,然后同時進行編輯。

          Ctrl + D 選擇當前光標所在的詞并高亮該詞所有出現的位置,再次 Ctrl + D 選擇該詞出現的下一個位置,在多重選詞的過程中,使用 Ctrl + K 進行跳過,使用 Ctrl + U 進行回退,使用 Esc 退出多重編輯。

          多重選詞的一大應用場景就是重命名——從而使得代碼更加整潔。盡管 Sublime Text 無法像 IDE(例如 Eclipse)那樣進行自動重命名,但我們可以通過多重選詞+多重編輯進行直觀且便捷的重命名:

          有時我們需要對一片區域的所有行進行同時編輯,Ctrl + Shift + L 可以將當前選中區域打散,然后進行同時編輯:

          有打散自然就有合并,Ctrl + J 可以把當前選中區域合并為一行:

          # 查找&替換(Finding&Replacing)

          Sublime Text 提供了強大的查找(和替換)功能,為了提供一個清晰的介紹,我將 Sublime Text 的查找功能分為 快速查找、標準查找 和 多文件查找 三種類型。

          # 快速查找&替換

          多數情況下,我們需要查找文中某個關鍵字出現的其它位置,這時并不需要重新將該關鍵字重新輸入一遍然后搜索,我們只需要使用 Shift + ←/→ 或 Ctrl + D 選中關鍵字,然后 F3 跳到其下一個出現位置, Shift + F3 跳到其上一個出現位置,此外還可以用 Alt + F3 選中其出現的所有位置(之后可以進行多重編輯,也就是快速替換)。



          # 標準查找&替換

          另一種常見的使用場景是搜索某個已知但不在當前顯示區域的關鍵字,這時可以使用 Ctrl + F 調出搜索框進行搜索:

          以及使用 Ctrl + H 進行替換:



          # 關鍵字查找&替換

          對于普通用戶來說,常規的關鍵字搜索就可以滿足其需求:在搜索框輸入關鍵字后 Enter 跳至關鍵字當前光標的下一個位置, Shift + Enter 跳至上一個位置, Alt + Enter 選中其出現的所有位置(同樣的,接下來可以進行快速替換)。

          Sublime Text 的查找有不同的模式:Alt + C 切換大小寫敏感(Case-sensitive)模式, Alt + W 切換整字匹配(Whole matching)模式,除此之外Sublime Text還支持在選中范圍內搜索(Search in selection),這個功能沒有對應的快捷鍵,但可以通過以下配置項自動開啟。


          "auto_find_in_selection": true

          這樣之后在選中文本的狀態下范圍內搜索就會自動開啟,配合這個功能,局部重命名(Local Renaming)變的非常方便:

          使用 Ctrl + H 進行標準替換,輸入替換內容后,使用 Ctrl + Shift + H 替換當前關鍵字, Ctrl + Alt + Enter 替換所有匹配關鍵字。

          # 正則表達式查找&替換

          正則表達式 是非常強大的文本查找&替換工具,Sublime Text中使用 Alt + R 切換正則匹配模式的開啟/關閉。Sublime Text的使用Boost里的Perl正則表達式風格。

          出于篇幅原因,本文不會對正則表達式進行詳細介紹,Mastering Regex(中譯本:精通正則表達式)對正則表達式的原理和各語言下的使用進行了詳細介紹。此外網上有大量正則表達式的優秀教程(“正則表達式30分鐘入門教程” 和 MSDN正則表達式教程.aspx)),以及在線測試工具(regexpal 和 regexer)。

          # 多文件搜索&替換

          使用 Ctrl + Shift + F 開啟多文件搜索&替換(注意此快捷鍵和搜狗輸入法的簡繁切換快捷鍵有沖突):

          多文件搜索&替換默認在當前打開的文件和文件夾進行搜索/替換,我們也可以指定文件/文件夾進行搜索/替換。

          # 跳轉(Jumping)

          Sublime Text 提供了強大的跳轉功能使得我們可以在不同的文件/方法/函數中無縫切換。就我的使用經驗而言,目前還沒有哪一款編輯器可以在這個方面超越Sublime Text。

          # 跳轉到文件

          Ctrl + P 會列出當前打開的文件(或者是當前文件夾的文件),輸入文件名然后 Enter 跳轉至該文件。

          需要注意的是,Sublime Text使用模糊字符串匹配(Fuzzy String Matching),這也就意味著你可以通過文件名的前綴、首字母或是某部分進行匹配:例如, EIS 、 Eclip 和 Stupid 都可以匹配 EclipseIsStupid.java 。



          # 跳轉到符號

          盡管是一個文本編輯器,Sublime Text 能夠對代碼符號進行一定程度的索引。Ctrl + R 會列出當前文件中的符號(例如類名和函數名,但無法深入到變量名),輸入符號名稱 Enter 即可以跳轉到該處。

          此外,還可以使用 F12 快速跳轉到當前光標所在符號的定義處(Jump to Definition)。

          比較有意思的是,對于 Markdown, Ctrl + R 會列出其大綱,非常實用。



          # 跳轉到某行

          Ctrl + G 然后輸入行號以跳轉到指定行:

          # 組合跳轉

          在 Ctrl + P 匹配到文件后,我們可以進行后續輸入以跳轉到更精確的位置:

          1.@ 符號跳轉:輸入 @symbol 跳轉到 symbol 符號所在的位置

          2.# 關鍵字跳轉:輸入 #keyword 跳轉到 keyword 所在的位置

          3.: 行號跳轉:輸入 :12 跳轉到文件的第12行。

          所以 Sublime Text 把 Ctrl + P 稱之為 “Go To Anything”,這個功能如此好用,以至于我認為沒有其它編輯器能夠超越它。

          # 中文輸入法的問題

          從 Sublime Text 的初版(1.0)到現在(3.0 3065),中文輸入法(包括日文輸入法)都有一個問題:輸入框不跟隨。

          目前官方還沒有修復這個 bug,解決方法是安裝 IMESupport 插件,之后重啟 Sublime Text 問題就解決了。



          # 文件夾(Folders)

          Sublime Text 支持以文件夾做為單位進行編輯,這在編輯一個文件夾下的代碼時尤其有用。在 File 下 Open Folder :

          你會發現右邊多了一個側欄,這個側欄列出了當前打開的文件和文件夾的文件,使用 Ctrl + K, Ctrl + B 顯示或隱藏側欄,使用 Ctrl + P 快速跳轉到文件夾里的文件。

          # 窗口&標簽(Windows & Tabs)

          Sublime Text 是一個多窗口多標簽編輯器:我們既可以開多個Sublime Text窗口,也可以在一個Sublime Text窗口內開多個標簽。



          # 窗口(Window)

          使用 Ctrl + Shift + N 創建一個新窗口(該快捷鍵再次和搜狗輸入法快捷鍵沖突,個人建議禁用所有搜狗輸入法快捷鍵)。

          當窗口內沒有標簽時,使用 Ctrl + W 關閉該窗口。

          # 標簽(Tab)

          使用 Ctrl + N 在當前窗口創建一個新標簽, Ctrl + W 關閉當前標簽, Ctrl + Shift + T 恢復剛剛關閉的標簽。

          編輯代碼時我們經常會開多個窗口,所以分屏很重要。Alt + Shift + 2 進行左右分屏, Alt + Shift + 8 進行上下分屏, Alt + Shift + 5 進行上下左右分屏(即分為四屏)。

          分屏之后,使用 Ctrl + 數字鍵 跳轉到指定屏,使用 Ctrl + Shift + 數字鍵 將當前屏移動到指定屏。例如, Ctrl + 1 會跳轉到1屏,而 Ctrl + Shift + 2 會將當前屏移動到2屏。

          # 全屏(Full Screen)

          Sublime Text 有兩種全屏模式:普通全屏和無干擾全屏。

          個人強烈建議在開啟全屏前關閉菜單欄(Toggle Menu),否則全屏效果會大打折扣。

          F11 切換普通全屏:

          Shift + F11 切換無干擾全屏:



          # 風格(Styles)

          風格對于任何軟件都很重要,對編輯器也是如此,尤其是GUI環境下的編輯器。作為一個程序員,我希望我的編輯器足夠簡潔且足夠個性。

          Notepad++ 默認界面

          Sublime Text 默認界面

          所以在用過 Sublime Text 之后,我立刻就卸掉了 Notepad++。

          Sublime Text 自帶的風格是我喜歡的深色風格(也可以調成淺色),默認主題是Monokai Bright,這兩者的搭配已經很不錯了,不過我們還可以做得更好:接下來我將會展示如何通過設置偏好項和添加自定義風格/主題使得 Sublime Text 更加 Stylish。

          # 一些設置(Miscellaneous Settings)

          下面是我個人使用的設置項。

          // 設置Sans-serif(無襯線)等寬字體,以便閱讀
          "font_face": "YaHei Consolas Hybrid",
          "font_size": 12,
          // 使光標閃動更加柔和
          "caret_style": "phase",
          // 高亮當前行
          "highlight_line": true,
          // 高亮有修改的標簽
          "highlight_modified_tabs": true,

          設置之后的效果如下:



          # 主題(Themes)

          Sublime Text 有大量第三方主題:[https://sublime.wbond.net/browse/labels/theme],這里我給出幾個個人感覺不錯的主題:

          Soda Light

          Soda Dark

          Nexus

          Flatland

          Spacegray Light

          Spacegray Dark



          # 配色(Color)

          colorsublime 包含了大量 Sublime Text 配色方案,并支持在線預覽,配色方案的安裝教程在 這里,恕不贅述。

          我個人使用的是 Nexus 主題和 Flatland Dark 配色,配置如下:

          "theme": "Nexus.sublime-theme",
          "color_scheme": "Packages/Theme - Flatland/Flatland Dark.tmTheme",

          效果如下:

          # 編碼(Coding)

          優秀的編輯器使編碼變的更加容易,所以 Sublime Text 提供了一系列功能以提高開發效率。



          # 良好實踐(Good Practices)



          良好的代碼應該是規范的,所以Google為每一門主流語言都設置了其代碼規范(Code Style Guideline)。我自己通過下面的設置使以規范化自己的代碼。

          // 設置tab的大小為2
          "tab_size": 2,
          // 使用空格代替tab
          "translate_tabs_to_spaces": true,
          // 添加行寬標尺
          "rulers": [80, 100],
          // 顯示空白字符
          "draw_white_space": "all",
          // 保存時自動去除行末空白
          "trim_trailing_white_space_on_save": true,
          // 保存時自動增加文件末尾換行
          "ensure_newline_at_eof_on_save": true,

          # 代碼段(Code Snippets)

          Sublime Text 支持代碼段(Code Snippet),輸入代碼段名稱后 Tab 即可生成代碼段。

          你可以通過Package Control安裝第三方代碼段,也可以自己創建代碼段,參考這里。

          # 格式化(Formatting)

          Sublime Text 基本的手動格式化操作包括:Ctrl + [ 向左縮進, Ctrl + ] 向右縮進,此外 Ctrl + Shift + V 可以以當前縮進粘貼代碼(非常實用)。

          除了手動格式化,我們也可以通過安裝插件實現自動縮進和智能對齊:

          1.HTMLBeautify:格式化HTML。

          2.AutoPEP8:格式化Python代碼。

          3.Alignment:進行智能對齊。

          # 自動完成(Auto Completion)

          Sublime Text 支持一定的自動完成,按 Tab 自動補全。



          # 括號(Brackets)

          編寫代碼時會碰到大量的括號,利用 Ctrl + M 可以快速的在起始括號和結尾括號間切換, Ctrl + Shift + M 則可以快速選擇括號間的內容,對于縮進型語言(例如Python)則可以使用 Ctrl + Shift + J 。

          此外,我使用 BracketHighlighter 插件以高亮顯示配對括號以及當前光標所在區域,效果如下:



          # 命令行(Command Line)

          盡管提供了 Python 控制臺,但 Sublime Text 的控制臺僅支持單行輸入,十分不方便,所以我使用 SublimeREPL 以進行一些編碼實驗(Experiments)。



          # 其它(Miscellaneous)

          盡管我試圖在本文包含盡可能多的 Sublime Text 實用技能,但受限于篇幅和我的個人經驗,本文仍不免有所遺漏,歡迎在評論里指出本文的錯誤及遺漏。

          下面是一些可能有用但我很少用到的功能:

          1.宏(Macro):Sublime Text 支持錄制宏,但我在實際工作中并未發現宏有多大用處。

          2.其它平臺(Other Platforms):本文只介紹了 Windows 平臺上 Sublime Text 的使用,不過 Linux 和 OS X 上Sublime Text的使用方式和Windows差別不大,只是在快捷鍵上有所差異,請參考 Windows/Linux快捷鍵 和 OS X 快捷鍵。

          3.項目(Projects):Sublime Text支持簡單的 項目管理,但我一般只用到文件夾。

          4.Vim模式(Vintage):Sublime Text自帶 Vim模式。

          5.構建(Build):通過配置,Sublime Text可以進行 源碼構建。

          6.調試(Debug):通過安裝 插件,Sublime Text 可以對代碼進行調試。

          # 快捷鍵列表(Shortcuts Cheatsheet)

          我把本文出現的Sublime Text按其類型整理在這里,以便查閱。

          通用(General)

          1.↑↓←→:上下左右移動光標,注意不是不是 KJHL !

          2.Alt:調出菜單

          3.Ctrl + Shift + P:調出命令板(Command Palette)

          4.Ctrl + ` :調出控制臺

          # 編輯(Editing)

          1.Ctrl + Enter:在當前行下面新增一行然后跳至該行

          2.Ctrl + Shift + Enter:在當前行上面增加一行并跳至該行

          3.Ctrl + ←/→:進行逐詞移動

          4.Ctrl + Shift + ←/→進行逐詞選擇

          5.Ctrl + ↑/↓移動當前顯示區域

          6.Ctrl + Shift + ↑/↓移動當前行

          #選擇(Selecting)

          1.Ctrl + D:選擇當前光標所在的詞并高亮該詞所有出現的位置,再次 Ctrl + D 選擇該詞出現的下一個位置,在多重選詞的過程中,使用 Ctrl + K 進行跳過,使用 Ctrl + U 進行回退,使用 Esc 退出多重編輯

          2.Ctrl + Shift + L:將當前選中區域打散

          3.Ctrl + J:把當前選中區域合并為一行

          4.Ctrl + M:在起始括號和結尾括號間切換

          5.Ctrl + Shift + M:快速選擇括號間的內容

          6.Ctrl + Shift + J:快速選擇同縮進的內容

          7.Ctrl + Shift + Space:快速選擇當前作用域(Scope)的內容

          # 查找&替換(Finding&Replacing)

          1.F3:跳至當前關鍵字下一個位置

          2.Shift + F3:跳到當前關鍵字上一個位置

          3.Alt + F3:選中當前關鍵字出現的所有位置

          4.Ctrl + F/H:進行標準查找/替換,之后:

          5.Alt + C:切換大小寫敏感(Case-sensitive)模式

          6.Alt + W:切換整字匹配(Whole matching)模式

          7.Alt + R:切換正則匹配(Regex matching)模式

          8.Ctrl + Shift + H:替換當前關鍵字

          9.Ctrl + Alt + Enter:替換所有關鍵字匹配

          10.Ctrl + Shift + F:多文件搜索&替換

          # 跳轉(Jumping)

          1.Ctrl + P:跳轉到指定文件,輸入文件名后可以:

          2.@ 符號跳轉:輸入 @symbol 跳轉到 symbol 符號所在的位置

          3.# 關鍵字跳轉:輸入 #keyword 跳轉到 keyword 所在的位置

          4.: 行號跳轉:輸入 :12 跳轉到文件的第12行。

          5.Ctrl + R:跳轉到指定符號

          6.Ctrl + G:跳轉到指定行號

          # 窗口(Window)

          1.Ctrl + Shift + N:創建一個新窗口

          2.Ctrl + N:在當前窗口創建一個新標簽

          3.Ctrl + W:關閉當前標簽,當窗口內沒有標簽時會關閉該窗口

          4.Ctrl + Shift + T:恢復剛剛關閉的標簽

          # 屏幕(Screen)

          1.F11:切換普通全屏

          2.Shift + F11:切換無干擾全屏

          3.Alt + Shift + 2:進行左右分屏

          4.Alt + Shift + 8:進行上下分屏

          5.Alt + Shift + 5:進行上下左右分屏

          6.分屏之后,使用 Ctrl + 數字鍵 跳轉到指定屏,使用 Ctrl + Shift + 數字鍵 將當前屏移動到指定屏

          延伸閱讀(Further Reading)

          # 書籍(Books)

          Mastering Sublime Text:我讀過的唯一一本關于 Sublime Text 的書籍,書中介紹的插件很實用,但對編輯技巧介紹不全。

          Instant Sublime Text Starter:另外一本關于 Sublime Text的書,我沒有讀過。

          # 鏈接(Links)

          1.官方文檔:http://www.sublimetext.com/docs/3/

          2.官方論壇:http://www.sublimetext.com/forum/

          3.Stack Overflow 的 Sublime Text 頻道:4.http://stackoverflow.com/questions/tagged/sublimetext

          5.http://stackoverflow.com/questions/tagged/sublimetext2

          6.http://stackoverflow.com/questions/tagged/sublimetext3

          7.非官方文檔:http://sublime-text-unofficial-documentation.readthedocs.org/ 甚至比官方文檔還要全面!

          8.Package Control:https://sublime.wbond.net/ 大量的 Sublime Text 插件和主題。

          # 視頻(Videos)

          1.Getting Started with SublimeText:https://www.youtube.com/watch?v=04gKiTiRlq8

          2.Sublime Text Pefect Workflow:https://www.youtube.com/watch?v=bpEp0ePIOEM&list=PLuwqxbvf3olpLsnFvo06gbrkcEB5o7K0g

          例簡介

          Sublime Text是一個代碼編輯器,也是HTML和散文先進的文本編輯器。

          本文通過實例來介紹項目中常用快捷鍵和插件的用法,熟悉快捷鍵和引用插件可以極大地提高我們的開發效率。

          常用快捷

          輸入“html:5”后點擊Tab鍵或輸入“!”后點擊Ctrl+E都能轉換為html5的骨架結構,轉換為的代碼如下圖:

          Tips:需安裝Emmet插件;

          右下角的文本類型要選為“html”。

          輸入“div.wrapper>div.header>span.title{標題}”或“ul.lis>li*5>p.title+p.content”后點擊Tab可以快速生成相應的代碼,轉換為的代碼如下圖:

          Tips:上面兩種寫法只是其中的一部分,大家可以自己練習多種組合;

          img[src="face/bd/$.gif"] +Tab,bd目錄下自動從1開始到最后,適合于一次性增加從1--多個的圖片。

          “Ctrl+Shift+P”用于快速更改文件類型(js/css)(第一圖)、安裝插件(第二圖)等,如下圖:

          “Ctrl+G”用于快速定位到行數,比如審查元素知道修改的樣式在那一行,就可以點擊快捷鍵,然后輸入行數,就能定位到相應的位置進行修改;

          “Ctrl+C”用于撤回信息,而“Ctrl+Y”用于恢復信息,都可多次操作;

          “Ctrl+/”用于注釋信息,可單行也可以多行;

          “Ctrl+F”用于查找輸入的內容,可往前、往后或全部查找;

          “Ctrl+Shirt+D”用于復制游標所在行;

          “Ctrl+D”用于選擇游標所在單詞,連續“Ctrl+D”實現多個選擇(選擇與第一次選擇相同的單詞);如果中間有要跳過的相同單詞,可以先點擊“Ctrl+K”再點擊“Ctrl+D”;

          “Alt+F3”用于選擇所有與游標所在單詞相同的單詞,跟上面一個快捷鍵對于批量修改非常方便。


          “Alt+Shift+1/2/3”,后面數字表示要顯示多少列,如下圖,對于參照html編寫css和js有很大的便利。

          Tips:從標題到這塊是最經常用到的快捷鍵,一定熟悉記住。

          “Ctrl+] ”增加縮進,“Ctrl+] ” 減小縮進,好的排版有利于查看;

          “Ctrl+Shift+V”保持縮進粘貼,直接用“Ctrl+V”有時會導致顯示排版亂了,使用該快捷鍵可以保持原來的排版;

          “Ctrl+PgUp”往前切換Tab欄的文件,“Ctrl+PgDn”往后切換Tab欄的文件;

          “/**+Tab”常用于js的自動補全注釋信息和內容;

          “Ctrl+P”用于快速查找并打開文件,點擊快捷鍵后打開命令面板,直接點擊就可以打開文件,也可以進行搜索操作;

          “Ctrl+L”用于選擇單行;

          “Ctrl+H”用于查找替換,可替換單個或全部替換;

          “Ctrl+Shift+Enter”在當前上方添加一行;

          右鍵點擊“Open Containing Folder”可以打開該文件的本地目錄。


          “Ctrl+Shift+P”打開命令面板,輸入range點擊第一條就會出現了,然后輸入開始和結束數字,可以批量修改序號,需安裝插件Text Pastry。

          “跟蹤函數ctags”在使用函數調轉功能前,需要先生成.tags文件,只需在項目文件管理器的項目文件上右鍵點擊Ctags:Rebuild Tags即可(注意,在改動文件之后會重新生成.tags);所有工作都準備充分之后,就可以在函數名上右鍵點擊navigate 頭definition跳轉到指定函數了,返回用jump back,需安裝插件ctags。

          常用插件

          直接安裝:直接下載安裝包解壓縮到Packages目錄(菜單->preferences->Browse Packages); 

          使用Package Control組件安裝(在線安裝):點擊“Ctrl+`”,然后輸入“import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())()”回車,下載完畢后,重啟Sublime Text程序;如果在Perferences->中看到package control這一項,則安裝成功。

          Tips:輸入代碼為3版本,其他版本代碼可以百度搜索。

          用Package Control安裝插件的方法,按下“Ctrl+Shift+P”調出命令面板,輸入install 調出 Install Package 選項并回車,然后在列表中選中要安裝的插件。

          比如“Emmet”,在搜索框輸入“Emmet”,列表就會顯示插件“Emmet”,然后點擊該條數據,就會開始安裝該插件,安裝信息可查看左下角。

          Tips:安裝插件時保持網絡暢通,避免插件由于網絡原因奔潰。

          常用插件的用法說明:

          Emmet(原名 Zen Coding):一種快速編寫html/css的方法;

          Autoprefixer:CSS3私有前綴自動補全插件;

          AutoFileName:顯示路徑下文件名;

          SyncedSidebarBg:自動同步側邊欄底色為編輯窗口底色;

          HTML-CSS-JS Prettify:html/css/js格式化工具,依賴node.js,格式化的HTML不能有中文和中文符號等,HTMLPrettify.sublime-settings路徑對應node安裝目錄,使用快捷鍵“Ctrl+Shift+H”;

          sublimelinter:檢查js語法;

          jQuery:補全JQ代碼;

          Text Pastry:可以一次性改批量序號,用法快捷鍵里面有介紹;

          ctags:跟蹤函數,用法快捷鍵里面有介紹;

          Less2Css:保存less文件時候自動生成css文件,windows下,Less2CSS對lessc.cmd有依賴,請下載:https://github.com/duncansmart/less.js-windows/releases后并將其路徑( E:/Less)添加至系統環境變量中;一般建議生產環境不使用less,所以這個還是蠻方便的;

          SideBarEnhancements:設置瀏覽器,如下圖。


          主站蜘蛛池模板: 日本精品一区二区三区在线视频一 | 99久久无码一区人妻a黑| 免费日本一区二区| 亚洲一区二区免费视频| 国产一区二区三区精品视频| 精品人妻一区二区三区四区在线| 精品无码成人片一区二区98| 无码国产精品一区二区免费模式 | 日韩精品午夜视频一区二区三区| av无码人妻一区二区三区牛牛| 国产在线观看91精品一区| 免费无码A片一区二三区| 91一区二区三区四区五区 | 夜夜高潮夜夜爽夜夜爱爱一区| 人妻无码久久一区二区三区免费| 国产综合一区二区在线观看| 国产免费播放一区二区| 高清无码一区二区在线观看吞精| 日本免费电影一区| 大帝AV在线一区二区三区| 一区二区不卡在线| 麻豆精品人妻一区二区三区蜜桃 | 国产一区二区视频在线播放| 久久久久女教师免费一区| 日韩精品无码Av一区二区| 国产精品无码一区二区在线观一 | 精品国产一区二区三区久久狼 | 国产99精品一区二区三区免费| 波多野结衣在线观看一区二区三区| 天美传媒一区二区三区| 国产一区风间由美在线观看| 波多野结衣中文字幕一区| 国产精品区AV一区二区| 国产精品无码AV一区二区三区| 中文字幕精品一区二区精品| 久久精品国产第一区二区三区| 亚洲一区在线视频| 国产一区二区三区在线观看免费| 一区二区网站在线观看| 国产伦一区二区三区高清| 亚洲AV福利天堂一区二区三|