前端要用到的sublime text插件？

大神們可不可以列舉一下前端要用到的插件名稱

• Package Control：這個特殊的「插件包」，可以很容易地安裝、升級、刪除，甚至非常方便地查看您已經安裝在SublimeText中的包或插件的列表。它通過菜單和對應的行為使這些過程變得非常容易和有組織。

• Emmet：Emmet（譯者註：前身就是以前大名鼎鼎的Zen Coding，這個如果你沒聽說和使用過，就悲哀了）是一個可以讓你更快更高效地編寫HTML和CSS，節省你大量時間的插件。

• SublimeLinter：這個插件最近才為SublimeText3重建和發布。新版本顯然帶來了很多新的有所不同的功能，而不是簡單地把所有的Linter 放在一個包中，開發者允許用戶在升級時選擇並安裝自己經常使用的Linter。很明顯，這可以節省磁碟空間。「更多的定製」，這對用戶是很友好的。

• SideBarEnhancement：這個插件可以給SublimeText的邊欄菜單帶來擴充的功能，包括：在當前工程文件夾中新建文件，移動文件或文件夾，產生文件或文件夾的副本，在新窗口或瀏覽器中打開，刷新等。

• Git：這個插件會將Git整合進你的SublimeText，使的你可以在SublimeText中運行Git命令，包括添加，提交文件，查看日誌，文件註解以及其它Git功能。

• CSSComb：這是用來給CSS屬性進行排序的格式化插件。如果你想保持的代碼乾淨整潔，並且希望按一定的順序排列，那麼這個插件是一種有效解決的方案。特別是當你和其他有自己代碼編寫風格的開發者一同協作的時候。

• CanIUse：如果您想檢查瀏覽器是否支持你包括在你的代碼中的CSS和HTML元素，那麼這是你需要的插件。所有您需要做的就是選擇有疑問的元素，插件將為你做其餘的事情。

• Alignment：這個插件讓你能對齊你的代碼，包括 PHP、CSS 和 Javascript。代碼看起來更簡潔和可讀，便於編輯。

• ColorPicker：如果你經常要查看或設置顏色值，這個插件可以很方便地調用你本機的調色板應用。

• MarkDown Editing：SublimeText不僅僅是能夠查看和編輯 Markdown 文件，但它會視它們為格式很糟糕的純文本。這個插件通過適當的顏色高亮和其它功能來更好地完成這些任務。

• FileDiffs這個插件允許你看到SublimeText中兩個不同文件的差異。你可以比較的對象可以是從剪貼板中複製的數據，或工程中的文件，當前打開的文件等。

• DocBlockr：DocBlockr 可以使你很方便地對代碼建立文檔。它會解析函數，變數，和參數，根據它們自動生成文檔範式。

• BracketHighlighter：高亮括弧對齊，針對代碼很長超過一屏時這個就很好用了。

• EditorConfig：幫助開發者在不同的編輯器，IDE之間定義和維護統一的編程風格。EditorConfig工程包含一個文件，定義了編程風格，文本編輯器插件集合，讓編輯器可以讀取該文件並依照它來定義風格。

• AllAutocomplete：傳統的Sublime Text自動補全插件僅僅在當前文件下工作。AllAutocomplete 可以搜索全部打開的標籤頁，這將極大的簡化開發進程。

• SublimeREPL：對開發者來講這個可能是最有用的插件之一了。SublimeREPL 可以直接在編輯器中運行一個解釋器，支持很多語言。

• AutoFileName：自動補全文件路徑-非常方便。

• MarkdownPreview：支持markdown的插件，支持預覽功能。

• JsFormat：javascript格式化工具。

• SublimeCodeIntel：代碼自動提示功能的插件。

• JsMinifier：

  該插件基於Google Closure compiler，自動壓縮js文件。

• Sublime Prefixr：Prefixr，CSS3 私有前綴自動補全插件。

• Clipboard history：粘貼板歷史記錄，方便使用複製/剪切的內容。

後期歡迎關注移動開發在線分享站，分類整理移動開發相關資源。

【JS開發者常用的10個Sublime Text插件】

Sublime Text 是每個開發者工具箱中都應該有的一個強大的應用。它是一個跨平台的、高定製化的、高級的文本編輯器，在功能強大的 集成開發環境（眾所周知地消耗資源）和類似於 Vim 或 Emacs 的命令行編輯器（學習成本非常高）之間取得了很好的平衡。

使得 Sublime 如此強大的原因之一就是其可擴展的插件架構。開發者可以很容易地擴展 Sublime 的核心功能，添加一些新特性，比如補全代碼、嵌入遠程介面文檔。Sublime Text 不帶有可以啟用的插件 – 它們通常通過第三方包管理器安裝，簡稱為 包管理器。安裝 Sublime Text 的包管理器，請按照 官網的安裝教程 進行安裝。

本文針對 JavaScript 開發者，簡要介紹了十個 Sublime 插件，每一個都能夠幫助你改善工作流，並且提高工作效率。那麼，就讓我們一起來看看吧！

1. Babel

我首先要介紹的就是 Babel 插件。這個插件可以在你的 ES6/2015 和 React JSX 代碼上添加語法高亮。安裝插件之後，第一件要做的事就是把它設置為 .es6、 .jsx、 以及 .js 文件的默認語法。然而，如果你正在使用 ES3/5 工作，那你要注意最後一種文件，不要使用 Babel 編譯你的代碼。

如果你還沒有享受過 Babel 的樂趣，我強烈建議你去嘗試它。它允許你將 ES6/2015 和 JSX 代碼編譯成 ES5。並且它很好的整合了目前流行的構建工具和命令行工具。當然，它不支持傳統瀏覽器，但是如果你想支持 IE10 或者更低版本可以在他們的 附加文檔頁面 查看相關說明。

不幸的是， Babel 插件不允許在 Sublime 內編譯 ES6 代碼。對於那些想實現此功能的人，我建議你查看 Compile Selected ES6。

2. JSHint

下一個就是 Sublime 的 JSHint 插件。JSHint 是一個 JavaScript 檢測器，它會查看你的代碼，並驗證其是否具有正確的樣式和語法，避免犯相關的常見錯誤。無論你是個新手還是老手，JSHint 都是必不可少的。查看 JSHint 的「關於頁面」，可了解更多信息。

為了 JSHint 插件能夠在 SublimeText 中正常工作，你需要通過 npm 全局安裝 JSHint：

npm install -g jshint

如果你不確定應該如何做這一步，請瀏覽《getting started with the Node Package manager》這裡的教程。

一旦 npm 的 JSHint 模塊和 SublimeText 的 JSHint 的插件安裝好了，你就能夠簡便地使用 JSHint 了，只要打開 JavaScript 文件，然後按下 Ctrl + J （在 Linux/Windows 上是Alt + J ）。或者，你可以通過菜單打開 JSHint 功能。

如果你已經安裝了插件，但是想要在有錯誤的地方有更明顯的提示，請瀏覽 JSHint Gutter。或者，你想在安裝 NPM 包和插件之前試一試 JSHint，http://JSHint.com 有一個很棒的在線交互工具，你可以把代碼粘貼到裡面得到實時的反饋。

3. JsFormat

JsFormat 基於 JS Beautifier，可以幫助你自動格式化 JavaScript 和 JSON。如果你只想用它格式化 JSON 字元串，那它值得你擁有。但是對於我來說，最大的優勢是，當我需要讀其他開發人員的代碼，甚至於是我很久以前寫的代碼。

這種代碼通常可讀性差，統一的格式化代碼樣式會非常有幫助。儘管格式化工具並不適合每個人，但它們在代碼中使用統一的結構，這對開發者閱讀代碼是非常有用的。檢查器會注意到這些，但是他們不需要做好每件事，不會自動格式化代碼。代碼格式化工具可以節約很多時間，解決很多令人頭痛的問題。

安裝好就要使用 JSFormat ，打開你的 JS 文件，然後在 Windows/Linux 上按下 Ctrl + Alt + f 或者在 Mac 上按下 Ctrl + ? + f。或者，你也可以使用菜單欄。

你可能會想：「但是如果我不喜歡它格式化 JavaScript 的樣式怎麼辦？」

好消息！JsFormat 是基於 JS Beautifier settings 高度配置化的。在 SublimeText 3 中 Preferences -&> Package Settings -&> JsFormat -&> Settings - Default 可以調整這些配置。

然後可以設置你喜歡的 JSON 格式。

4. DocBlockr

給代碼添加註釋有時候真是件痛苦地事情。我幾乎不認識任何人會享受添加註釋，但是這確實是非常必要的。DocBlockr 通過添加簡潔的評論幫助我們減輕了痛苦。安裝 DocBlockr 之後，你只需要在一行的開始輸入 /* 或者 /** ，剩下的事情它會為你做好。如果你在一個方法上面使用 /**，它會生成 JSDoc 格式的注釋。如果你從沒有使用過類似的工具，DocBlockr 會讓你覺得以前沒有它是如何寫代碼的。

DocBlockr 也支持許多其他的語言，包括：CoffeeScript、 TypeScript、 PHP、 ActionScript、 Haxe、 Java、 Apex、 Groovy、 Objective C、 C、 C++ 和 Rust。

5. SideBar Enhancements

客觀來說，SublimeText 在側邊文件樹的位置只有很少的幾個操作選項。簡單來說，SideBarEnhancements 解決了這個問題。顯然，這個插件提供了為文件和文件夾提供了 「移到垃圾箱」 選項、「用…打開」 選項以及剪貼板相關選項。它還可以讓你用瀏覽器里打開文件，以 data:uri base64（可以方便地在CSS中嵌入圖片） 格式拷貝文件，提供一系列的搜索操作。它很好地整合了 SideBarGit 可以在側邊欄直接提供 Git 命令，這是一個額外的功能。

隨著 JavaScript 代碼庫的不斷增大，以一種明智的方式瀏覽你的項目和操縱項目中的文件是很有必要的。因此這個插件必不可少。

6. AngularJS

由 Angular-UI 團隊開發，它可能是所有推薦插件列表上比較大的一個（但是也非常有用）。它的只要特徵包括：

• 自動完成 AngularJS 指令（ng-model, ng-repeat等）

• 自動完成你的自定義指令

• 快速查看 directives, controllers 和 filters 的面板

• 相關的片段

• 核心的指令文檔

Angular 是一個如此大的庫，我發現它非常有用。它有很多設置選項，可以在 項目首頁 瀏覽。

為了利用這個插件的語法高亮特性，你可以給你的 HTML 文件更改視圖類型：View -&> Syntax -&> HTML (Angular.js)

7. TypeScript

TypeScript 是 JavaScript 的超集，可以編譯成普通的 JavaScript。這可能對普通開發者來說並不重要，除了今年三月的一個小公告，Angular 2 將基於 typescript 構建。這意味著如果你使用 Angular 並打算以後繼續使用 Angular2 ，這個插件必須安裝。

這個插件由微軟支持，添加了代碼自動補全、適當的語法高亮、代碼格式化和擴展 TypeScript 項目的導航能力。它還帶有一個構建系統允許你將 TypeScript 編譯成 JavaScript。

要進行編譯，可以去 Tools -&> Build System 選擇 TypeScript。然後打開後綴名為 .ts 的文件，選擇 Tools -&> Build，或者按下 Ctrl + B。你可能會問構建的參數，之後插件會將編譯後的 JavaScript 文件輸出在相同的目錄下。唯一要說明的就是需要安裝 Node。

用插件自己的話說，它提供了「在 Sublime Text 下使用 TypeScript 編程的增強的體驗」。這是確實是真的，它是的在前面提到的臃腫的 IDEs 上開發的人員眼前一亮。

8. Handlebars

如果你正在使用 Ember.js 或者僅僅是使用 Handlebars 作為你的模板語言的選擇，那麼你絕對不能缺少它。沒有它，你可能會把所有的語法高亮去掉。

除了語法高亮（它作用於單獨的模板文件以及腳本標籤中的內聯模板）之外，它還提供了使用 tab 鍵轉換變數為表達式。例如，輸入 x-temp 並按下 TAB 鍵就會生成：

&