設置sublime text2/3中默認預覽瀏覽器快捷鍵的方法

各位前端大神們，你們在用IDE編輯器的時候喜歡用哪些呢？是Dreamweaver、Zend Studio、editplus又或者是sublime text？今天馬浩周給你們就要說說設置sublime text2/3中默認預覽瀏覽器快捷鍵的方法了，可能你早都設置了，（設置好的自動忽略）。此篇文章講給sublime text的使用新手們。

咱們爲何要設置默認的預覽瀏覽器呢？由於搞前端的都知道，你在預覽的時候不可能只預覽一個瀏覽器，可能須要多個，固然今天咱們舉例中會說道谷歌瀏覽器Chrome，IE瀏覽器Internet Explorer，火狐瀏覽器Firefox；爲何選擇這三個呢？由於他們就是咱們最經常使用的瀏覽器啦。別說你沒有用過！

先科（an）普（li）一下sublime text：（取自百科）

Sublime Text 是一個代碼編輯器（Sublime Text 2是收費軟件，但能夠無限期試用），也是HTML和散文先進的文本編輯器。Sublime Text是由程序員Jon Skinner於2008年1月份所開發出來，它最初被設計爲一個具備豐富擴展功能的Vim。
Sublime Text具備漂亮的用戶界面和強大的功能，例如代碼縮略圖，Python的插件，代碼段等。還可自定義鍵綁定，菜單和工具欄。Sublime Text 的主要功能包括：拼寫檢查，書籤，完整的 Python API ， Goto 功能，即時項目切換，多選擇，多窗口等等。Sublime Text 是一個跨平臺的編輯器，同時支持Windows、Linux、Mac OS X等操做系統。

1：打開sublime text；

2：點擊》「首選項」——「按鍵綁定-用戶」以下圖，你看到的是一個空白的頁面：（漢化版本）

（點擊》「Preferences」——「Key Bindings—User」出現一個空白頁面：英文版本）

3：把下面的代碼複製，粘貼進去；

1. [
2. //ie
3. {
4. "keys": ["f12"],
5. "command": "side_bar_files_open_with",
6. "args": {
7. "paths": [],
8. "application": "C:/Program Files/Internet Explorer/iexplore.exe",
9. "extensions": ".*"
10. }
11. },
12. //chorme
13. {
14. "keys": ["alt+f12"],
15. "command": "side_bar_files_open_with",
16. "args": {
17. "paths": [],
18. "application": "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe",
19. "extensions": ".*"
20. }
21. }
22. ]

4：點擊file菜單，點擊save保存。

       不過不要覺得這麼簡單就完了，你知道上面的代碼說了些什麼嗎？爲何就設置好了呢？是否是有人照着作完後發現，本身設置的仍是沒有起到做用呢？哈哈，那就對了，讓馬浩周給你講解一下這段代碼你要注意和明白哪些吧！

"keys": ["f12"],

keys：表示快捷鍵，即 F12 能夠啓動ie瀏覽器進行預覽。固然你能夠設置你喜歡的鍵，能夠給出幾個經常使用按鍵：alt+F十二、ctrl+F12；

"application": "C:/Program Files/Internet Explorer/iexplore.exe",

application：表示瀏覽器所在的安裝路徑，只有路徑配置正確，纔可以正常調用瀏覽器。而上面的這個路徑是本人電腦上的瀏覽器路徑。什麼？你的瀏覽器路徑是什麼？我Tm怎麼知道呢？本身不會動手看下本身電腦上的瀏覽器路徑啊？找到正確的路徑覆蓋個人路徑就能夠了。

能夠細心的程序猿們已經發現，我在設置兩個瀏覽器的時候的路徑寫法不一樣，一種是用斜槓「/」另外一種是用雙反斜槓「\\」，其實這兩種寫法都是正確的，不過若是你寫成一個反斜槓「\」那就是錯誤滴！由於在Windows系統中:反斜槓\，在windows系統中用來表示目錄。正斜槓/表明網址、Url地址。而在sublime text中斜槓「/」和雙反斜槓「\\」是一個用途的。（扯的有點遠了~）

還有一個問題，若是你要添加多個瀏覽器怎麼辦，其實仍是同樣的方法，代碼也是同樣的，只是設置按鍵和路徑的問題了，這裏拿火狐來舉例：

1. // firefox
2. { "keys": ["f3"], "command": "side_bar_files_open_with",
3. "args": {
4. "paths": [],
5. "application": "D:/Program Files/Mozilla Firefox/firefox.exe",
6. "extensions":".*"
7. }
8. }

這樣就添加成功了。就這麼簡單。仍是同樣，修改你的鍵和修改你的正確瀏覽器地址。到這裏，設置sublime text2/3中默認預覽瀏覽器快捷鍵的方法馬浩周就已經都傳授於你了！下面這些是看一送二（我整理了一些sublime text的快捷鍵和經常使用插件），拿好，不謝，請叫我紅領巾！

Sublime Text快捷鍵：

• Ctrl+Shift+P：打開命令面板
• Ctrl+P：搜索項目中的文件
• Ctrl+G：跳轉到第幾行
• Ctrl+W：關閉當前打開文件
• Ctrl+Shift+W：關閉全部打開文件
• Ctrl+Shift+V：粘貼並格式化
• Ctrl+D：選擇單詞，重複可增長選擇下一個相同的單詞
• Ctrl+L：選擇行，重複可依次增長選擇下一行
• Ctrl+Shift+L：選擇多行
• Ctrl+Shift+Enter：在當前行前插入新行
• Ctrl+X：刪除當前行
• Ctrl+M：跳轉到對應括號
• Ctrl+U：軟撤銷，撤銷光標位置
• Ctrl+J：選擇標籤內容
• Ctrl+F：查找內容
• Ctrl+Shift+F：查找並替換
• Ctrl+H：替換
• Ctrl+R：前往 method
• Ctrl+N：新建窗口
• Ctrl+K+B：開關側欄
• Ctrl+Shift+M：選中當前括號內容，重複可選着括號自己
• Ctrl+F2：設置/刪除標記
• Ctrl+/：註釋當前行
• Ctrl+Shift+/：當前位置插入註釋
• Ctrl+Alt+/：塊註釋，並Focus到首行，寫註釋說明用的
• Ctrl+Shift+A：選擇當前標籤先後，修改標籤用的
• F11：全屏
• Shift+F11：全屏免打擾模式，只編輯當前文件
• Alt+F3：選擇全部相同的詞
• Alt+.：閉合標籤
• Alt+Shift+數字：分屏顯示
• Alt+數字：切換打開第N個文件
• Shift+右鍵拖動：光標多不，用來更改或插入列內容
• 鼠標的前進後退鍵可切換Tab文件
• 按Ctrl，依次點擊或選取，可須要編輯的多個位置
• 按Ctrl+Shift+上下鍵，可替換行

安裝經常使用插件：Ctrl+Shift+P（菜單 – Tools – Command Paletter），輸入 install 選中Install Package並回車，輸入或選擇你須要的插件回車就安裝了（注意左下角的小文字變化，會提示安裝成功），安裝其它插件也是這個方法，很是快速。

• ZenCoding
  不得不用的一款前端開發方面的插件，Write less , show more.安裝後可直接使用，Tab鍵觸發，Alt+Shift+W是個代碼機器。
• Alignment
  代碼對齊，如寫幾個變量，選中這幾行，Ctrl+Alt+A，哇，齊了。
• Prefixr
  寫 CSS可自動添加 -webkit 等私有詞綴，Ctrl+Alt+X觸發。
• Tag
  Html格式化，右鍵Auto-Format Tags on Ducument。
• Clipboard History
  剪貼板歷史記錄，顯示更多歷史複製，Ctrl+Shift+V觸發。
• SideBarEnhancements
  側欄右鍵功能加強，很是實用
• Theme – Soda
  完美的編碼主題，用過的都說好，Setting user裏面添加」theme」: 「Soda Dark.sublime-theme」
• GBK to UTF8
  將文件編碼從GBK轉黃成UTF8，菜單 – File裏面找
• SFTP
  直接編輯 FTP 或 SFTP 服務器上的文件，絕對FTP浮雲
• WordPress
  集成一些WordPress的函數，對於像我這種常常要寫WP模版和插件的人特別有用
• PHPTidy
  整理排版PHP代碼
• YUI Compressor
  壓縮JS和CSS文件

好了，設置sublime text2/3中默認預覽瀏覽器快捷鍵的方法到這裏就真的完了。若是你也正須要這個方法，能夠試試哦，若是設置出現問題，能夠第一時間聯繫我，我會盡我所能的幫助你完成sublime text的設置。若是遇到沒法解決的問題，馬浩周以爲做爲一個程序猿/前端工程師，你要有這種精神————