WebStorm

^[1] 

提供JavaScript、ECMAScript 6、TypeScript、CoffeeScript、Dart和Flow代碼輔助功能

幫助編寫HTML、CSS、Less、Sass和Stylus代碼

支持Node.js和主流框架，如React、Angular、 Vue.js、Meteor等

WebStorm分析項目，為應用程序中定義的所有方法、 函數、模塊、變量和類提供最佳代碼補全。 代碼輔助是上下文感知的，也可以特定於框架

具備每個人喜歡的多個插入符號和選擇。 同時編輯文件中的多個地方，甚至具備適用於它們的代碼補全和動態模板。 通過Alt+點擊來選擇編輯的地方。 或者，選擇當前單詞出現的地方並同時編輯它們

將AngularJS應用的代碼輔助帶領到更佳階段。 獲得有關默認和自定義指令、控制器和應用程序名稱以及數據綁定的代碼洞察的代碼建議

充分利用 Emmet 的縮寫功能來提高您的工作效率。 在HTML中輸入縮寫，然後按下Tab鍵，將其擴展到標記中

Emmet也適用於CSS和JSX

動態編輯可以立刻在瀏覽器中看到頁面內容更新（僅限於Google Chrome）， 無需重現加載，即可看到對HTML和CSS文件的變更。 它作為JavaScript調試會話的一部分

WebStorm強大的導航功能，在處理大型項目時， 提高代碼效率並節省時間

對於代碼中的任何方法、函數或變量，只需Ctrl+點擊或搜索其用途， 即可跳到其定義

通過雙擊 Shift ，即可進行隨處搜索（Search Everywhere ），在整個項目中搜索符號、文件或類名

結構視圖可以在當前打開的文件中輕鬆導航

內置了數百種檢查，覆蓋所有支持的語言。 除此之外，還可以使用ESLint、TSLint、Stylelint、JSCS、JSHint和JSLint

在輸入時，會直接在編輯器中報告所有錯誤和警告，並提供許多快速修復選項

任何可能有問題的代碼行都標記在編輯器右側的排水溝中，因此可以輕鬆地在長文件中發現錯誤和警告

還可以為整個項目運行代碼質量分析，並自動應用選定的快速修復

使用一致的代碼風格，使WebStorm在編寫代碼時自動應用配置的代碼風格，或者一次重新格式化整個文件

為任何語言配置代碼風格，包括縮進、空格、對齊規則等。 如果需要，可以將代碼風格方案保存在項目設置中，通過 VCS與團隊成員共享

自動應用項目文件.editorconfig中指定的代碼風格

^[2] 

WebStorm為客户端代碼提供先進的調試器，它與Google Chrome協同工作。 它內置在IDE中，因此調試時無需在編輯器和瀏覽器之間切換

依靠WebStorm調試器對源映射的支持，您可以輕鬆調試ECMAScript 6、TypeScript或CoffeeScript代碼

功能齊全的內置Node.js調試器也是立即可用。 用它調試在本地或遠程機器上運行的應用程序

WebStorm調試器有多重視圖，包括：框架、全局和局部變量以及Watcher。 變量值內聯顯示在編輯器中的用法旁邊。 可以在運行時輕鬆評估JavaScript表達式。 斷點支持掛起模式和條件

spy-js是一個內置工具，可以幫助跟蹤代碼並有效識別任何可能的瓶頸。 它適用於客户端JavaScript和Node.js，甚至還支持編譯為JavaScript語言

通過spy-js，可以看到觸發代碼執行的完整事件列表，然後深入瞭解事件的堆棧跟蹤，並瀏覽源碼中高亮顯示的跟蹤。 這些數據還用於推動代碼補全結果

spy-js還可以可視化應用程序結構。 使用spy-js圖查看項目文件如何與基於運行時數據的函數調用相關聯

輕鬆執行單元測試，因為WebStorm與流行的JavaScript測試框架集成

選擇Karma或Jest來測試客户端JavaScript代碼或Mocha來測試Node.js。 直接在IDE中運行和調試測試，以方便的可視格式查看結果，然後導航到測試代碼

代碼覆蓋率報告也適用於Karma測試運行器

WebStorm還支持Protractor，用於Angular、JSTestDriver、Cucumber.js的端到端測試，用於行為驅動開發和Nodeunit

WebStorm可以幫助捕獲和探索V8 CPU性能，以及Node.js應用程序的堆快照。 因為分析數據以最易於訪問的方式呈現，因此可以輕鬆識別應用程序中任何可能的熱點或內存泄漏

^[3] 

享受用統一的界面來運行Grunt和Gulp<0>任務以及<0>npm<0>腳本。 無需使用命令行來啓動任務

所有定義在項目gruntfile.js、gulpfile.js或package.json中的任務都列在工具窗口中，只需雙擊即可運行任何任務

還可以為任務創建Run/Debug配置，然後以熟悉的Run…或Debug…操作來運行或調試

除了WebStorm自身的幾百種檢查外，還可以使用ESLint、TSLint、Stylelint、JSHint或JSLint等連接器。 當輸入時，WebStorm將根據代碼運行這些東西，並且直接在編輯器中動態、高亮顯示任何問題

如果要確保符合項目代碼風格（比如：縮進、關鍵字後的空格等等），只需啓用JSCS，這是一個JavaScript代碼風格檢查器

通過npm管理Node.js對於WebStorm而言非常簡單。 右鍵點擊package.json文件以運行npm安裝命令。 如果忘記安裝某個模塊或忘記在package.json中列出它，內置檢查將發出警告

通過偏好（Preferences）訪問已安裝的本地npm和Bower依賴項的完整列表，可以在偏好安裝和更新npm模塊和客户端依賴項

集成PhoneGap、Cordova和Ionic

WebStorm通過以PhoneGap、Apache Cordova和Ionic框架開發的移動應用來促進您的工作流程。 可以直接從IDE創建、模擬和部署應用。

TypeScript編譯器

WebStorm可以使用其內置的編譯器，迅速輕鬆地將TypeScript代碼編譯成JavaScript。 可以手動或在tsconfig.json文件中指定編譯選項。 會在編輯器中動態報告所有編譯錯誤。

由於集成了Yeoman，可以直接從IDE歡迎屏幕訪問幾百個項目生成器。 新UI將幫助查找和安裝新生成器，並且它們將指導完成生成器步驟，所有這些操作都無需離開IDE

^[4] 

WebStorm以統一的UI處理多種流行的版本控制系統，確保在git、SVN、Mercurial和Perforce之間提供一致的用户體驗

任何未提交的變更都會高亮顯示在編輯器左側排水溝和“項目”視圖中。 只需點擊兩下即可輕鬆回滾任何變更

內置的可視化合並工具能夠以快速、直觀的方式解決所有衝突

處理GitHub時，請簽出您的項目，並且在IDE中生成所有拉取請求

無論是否使用VCS，本地歷史都真的可以保護代碼。 WebStorm跟蹤源文件中的任何變更，保護免受任何意外丟失或修改（即使是由其他應用程序造成的）。可以隨時檢查特定文件或目錄的歷史記錄，並回滾到以前的任何版本

該IDE定製化程度非常高。 將其調整為完全適合您的編程風格，從快捷鍵和視覺主題到工具窗口和編輯器佈局

WebStorm提供明暗外觀供您選擇。 可以在偏好（Preferences）中為每種語言設置配色方案，或者從互聯網上找一個熱門主題來用

如果要運行命令或命令行工具，不用離開IDE — 使用WebStorm的內置本地終端，可選擇將其設置為shell

如果決定藉助對新框架、集成工具和其他生產力功能的支持來豐富 WebStorm，IDE 插件庫中提供了數十種插件