如何把 Sublime 變身為 JavaScript 編輯器

Sublime 是一款非常流行并且強大的文本編輯工具， 除了它提供的基礎功能， 它還支持第三方插件， 配置適合我們工作流的插件可以讓使用 Sublime 的時候更加舒服。

插件控制中心

首先，我們需要安裝 Package Control, 進入它的安裝主頁 https://packagecontrol.io/installation

大家可以看到：

正如提示中描述的， 在 Sublime 中按下 Ctrl + ` 快捷鍵來打開控制臺， 然后把頁面中的那段腳本復制進去，然后執行就 OK 了。 腳本的具體內容大家一定要從 Package Control 的主頁去獲取， 因為這個腳本隨時可能會更新， 官方主頁上的一直是最新的。

成功安裝后， 就可以看到這個提示了：

接下來， 按下 Command + Shift + P 鍵， 打開命令面板， 并且輸入 install， 可以看到 Install Package 選項：

按下回車打開它， 就可以看到可用插件的列表了

一切就緒后， 可以開始配置插件了。 給大家推薦幾個我在用的插件。

JSHint Gutter 插件

JSHint 是非常流行的 JS 語法檢查工具， 它是一套獨立的庫， 并且提供命令行版本。 它可以幫助你寫出更加符合 JS 標準規范的代碼， 我們可以調用 jshint 命令并傳入我們的代碼文件， 它就會幫我們找出不符合規范的代碼，并且給出提示。

并且 Sublime 也提供了 JSHint 的支持， 我們只需要安裝插件， 就可以將 Sublime 和 JSHint 無縫集成起來了。

按照我們剛才的方式打開插件列表， 并且輸入 jshint，就可以看到 JSHint Gutter 插件了：

直接按下回車安裝。 JSHint 插件默認不會自動執行， 但我更偏好讓他在代碼編輯中自動檢測， 那么可以按下 Command + Shift + P 再次打開命令行面板， 然后輸入 jsHint， 選擇 Set Plugin Options 選項：

JSHint 插件的配置選項其實就是一個配置文件， 只需要將 lint_on_edit 屬性設置為 true 它就會自動執行了：

這樣， 當我們的代碼有不符合對方的時候， 插件就會給出錯誤提示：

如果想看到這些錯誤的詳細內容， 按下 Command + Shift + J 鍵來查看：

對于有代碼潔癖的同學， 或者希望寫出高質量代碼的朋友來說，JSHint 都會是一個很不錯的工具， 比較推薦。

JSDoc 插件

這個也是我比較喜歡的插件， JSDoc 顧名思義，就是一個文檔注釋插件。 比如我們可以向這樣，只輸入 /** 然后按下回車， JSDoc 就會根據下面函數定義生成注釋模板：

另外，JSDoc 本身也是一套工具體系， 除了插件能幫助我們生成方便的注釋模板之外， JSDoc 還能夠根據這些注釋輸出標準化的 API 文檔， 可謂一舉兩得。 JSDoc 插件的安裝方式也都一樣， 還是按照我們剛才的方法打開插件列表。

并且找到 DocBlockr， 然后安裝即可。

良好的注釋習慣， 也是寫出高質量代碼的一個保障。

結尾

這次跟大家聊了聊 Sublime 的插件， 插件幾乎存在于很多開發工具中， 合理的使用插件會對我們的開發過程提供很多幫助。 但插件也不是越多越好，太多的插件有時也會造成混亂。 希望大家都向大牛的方向邁進~

 

來自：http://www.swiftcafe.io/2016/08/17/sublime-js/