WebStorm經常使用功能的使用技巧分享

WebStorm 是 JetBrain 公司開發的一款 JavaScript IDE，使用很是方便，可使編寫代碼過程更加流暢。

本文在這裏分享一些經常使用功能的使用技巧，但願能幫助你們更好的使用這款強大的 JavaScript 開發工具。

代碼編輯

• 代碼跳轉: Ctrl + 左鍵 或者 Ctrl + B，能夠跳轉到函數或者變量的聲明位置
• 調用位置: Alt + F7，查找調用者
• 自動補全: 最好是修改一下響應時間，Settings->Editors->General->Code Completing: Autopopup in 0.
• 打開文件: Ctrl + Shift + N
• 打開類: Ctrl + N
• 打開函數: Ctrl + F12
• 「超級」打開: 雙擊 shift，能夠 search anywhere.
• 複製整行: Ctrl + D
• 刪除整行: Ctrl + Y
• 摺疊當前塊: Ctrl + 「-」，摺疊當前塊以及子塊: Ctrl + Alt + 「-」，摺疊所有塊: Ctrl + Shift + 「-」
• 展開, 把摺疊的快捷鍵換成」+」
• 選擇: Ctrl + W，會從小到大逐漸擴大。好比按一次,選中word，按兩次，選擇表達式, 三次, 整個函數

重構

• 更名: Shift + F6，修改函數名，變量名，文件名，同時修改全部引用的位置.
• 移動文件: F6, 並修改文件的引用位置, 包括 html 和 js文件
• 抽取函數: Ctrl + Alt + M，整塊代碼抽取成函數
• 抽取變量: Ctrl + Alt + V，當前選中抽取爲變量
• 移動整塊代碼: Ctrl + Shift + ↑↓
• 包裹: Ctrl + Alt + T，外層包裹，好比 if、try catch等

Run & Debug

能夠直接 Run & Debug NodeJS 腳本，也能夠執行服務端腳本

NPM

View -> Tool Windows -> npm，能夠打開 npm 快捷窗口

這裏能夠直接右鍵 update

能夠雙擊執行 npm 命令

自動測試

能夠在 IDE 中啓動測試框架，好比 karma.

能夠自動監控代碼變化，自動運行測試腳本.

版本控制

本地代碼控制

VCS -> Local history 能夠列出本次 WebStorm 啓動之後，全部的代碼修改。

能夠集成主流的版本控制工具, 如 git、mercurial、subversio 等

經過兩個按鈕, 便可完成 pull、update、merge、commit、push 的完整流程, 很是方便

經過 branch 管理工具，能夠方便的切換 branch 工做，同時能夠 create、close、merge 操做

Task

能夠與主流的 Task 平臺集成，能夠自動拉取 Task，自動建立提交記錄.

 

快捷鍵

經過 Ctrl + Shift + A，能夠快速的經過關鍵字檢索到相應的功能設置和快捷鍵。

這裏是快捷鍵文檔

 

格式化代碼

快捷鍵: Ctrl + Shift + L

能夠設置爲 commit 前自動格式化

靜態檢查

能夠集成主流靜態檢查工具

這裏以 ESLint 爲例

在 IDE 中能夠啓動對單個文件，或者整個工程的靜態檢查

新技術支持

支持最新技術，如 TypeScript CoffeeScript 最新版、 Angular二、ES6 ES7等，集成 Gulp、Grunt 等工具。

虛擬機參數

若是工程較大，強烈建議使用 64 位 jre，並修改虛擬機內存參數，根據本機物理內存儘可能設置大。

 

本文只分享了一些我的經常使用的基本操做，更多 WebStorm 功能的使用技巧，期待能和你們一塊兒探索。

轉自https://my.oschina.net/powertoolsteam/home