年度第二次更新WebStorm 2021.2發布了！此更新包含了很多功能，包括在保存時在瀏覽器中重新加載頁面、自動導入 for require()、React useState 鉤子的重命名重構等等。

下載WebStorm 2021.2

功能和改進列表分為以下幾類：

• 代碼編輯：能夠在保存時在瀏覽器中重新加載頁面、保存時的操作、臨時文件改進以及 Code With Me 的同步代碼完成。
• JavaScript 和 TypeScript：自動導入require()，支持 JSDoc 中的 TypeScript 類型，新的箭頭函數實時模板，以及在調試時使用預覽選項卡的能力。
• 框架和技術：React 的改進、 package.json 中私有 npm 包的代碼完成、端點 URL 的更好完成以及對 web 類型的擴展支持。
• 版本控制：GPG 簽名支持、預提交檢查的增強等。
• 可用性：一種更快的方式來重新組織工具窗口、自動緩存和日志清理等。

代碼編輯

保存時在瀏覽器中重新加載頁面

WebStorm 允許您使用內置 Web 服務器在瀏覽器中預覽 HTML 文件，現在它會在您編輯和保存 HTML、CSS 和 JavaScript 文件時自動更新瀏覽器中的頁面。

要開始使用，在編輯器中打開一個HTML文件，將鼠標懸停在它上面，然后點擊你想使用的瀏覽器的圖標--所有的瀏覽器都支持。你也可以通過主菜單中的 "View | Open in Browser "來在瀏覽器中預覽該文件。

這個新功能聽起來可能與WebStorm已經有一段時間的Live Edit功能相似。如果你想在無法在內置的IDE服務器上打開頁面時看到修改，你可以而且可能仍然需要使用Live Edit。有了這個新功能，我們希望提供一個更直接的體驗，使重載過程更可預測，并在所有瀏覽器中可用。

內置 HTML 預覽更新

2021.1中引入的內置HTML預覽現在有了新的工作流程。它不再自動保存文件并在輸入時重新加載頁面，而是現在只在保存時更新頁面，就像瀏覽器中的預覽一樣。我們將在下一個發布周期增加選擇這些行為的選項。

保存操作

你想在明確的保存動作上執行某些操作嗎？從現在開始，WebStorm將正確支持這一工作流程。已經有相當多的東西，你可以設置為對保存文件進行操作。例如，WebStorm會讓你在保存時運行Prettier。在這個版本中，我們重新設計了所有現有的功能，并將其收集在一個地方，在保存時重新格式化代碼和優化導入的能力將其置于首位。

要自定義WebStorm的保存行為，請進入 Preferences / Settings | Tools | Actions on Save。在那里你會發現一個可以用 ?S / Ctrl+S 觸發的動作列表。

要打開一個指令，請勾選其名稱旁邊的復選框。大多數動作將在任何保存時被觸發，這包括自動保存和明確保存動作。對于文件觀察者和上傳到默認服務器的動作，你可以在你希望它們被激活的時候選擇兩個選項。

如果你想調整一個特定動作的設置，將鼠標懸停在該動作上--你會看到一個鏈接，指向該動作的可用配置選項。點擊它就可以跳到IDE設置中的相關頁面。

暫存文件的改進

通過劃痕文件，你可以在項目環境之外做筆記或起草代碼。為了使它們更容易操作，我們在這個版本中包含了兩項改進。

首先，你現在可以選擇一些代碼，按??/Alt+Enter，然后選擇Create new scratch file from selection來快速創建一個包含相同代碼的新scratch。

除此之外，一旦您關閉空的臨時文件，WebStorm 將自動刪除它們，以幫助保持您的工作區干凈。

Code With Me 的改進

當你在Code With Me會話中處于跟隨模式時，你現在可以跟蹤你所跟隨的人使用什么代碼完成建議。

此外，Code With Me 最近推出了兩個新的中繼服務器：一個在美國西海岸，另一個在南非。這使 ping 幾乎快了三倍。

JavaScript 和 TypeScript

require() 的自動導入

此版本的下一個改進是針對 Node.js 開發人員的。您可能知道，當您完成 ES6 模塊中的符號時，WebStorm會添加缺少的導入語句。它現在將在 CommonJS 模塊中執行相同的操作 -將在代碼完成時插入require語句。

當 IDE 不確定應該在文件中使用哪種語法時，它會顯示一個彈出窗口，允許您在 ES6 和 CommonJS 語法之間進行選擇。

支持 JSDoc 注釋中的 TypeScript 類型

v2021.2 中最令人期待的改進之一——WebStorm 現在正確支持.js文件中JSDoc 注釋中使用的 TypeScript 語法。在此版本中，我們重新設計并擴展了現有支持，使 WebStorm 能夠識別更多語法結構。我們還修復了許多已知問題。例如，現在支持@typedef聲明中的可選屬性。

添加箭頭功能的新動作

我們添加了一個新的實時模板來幫助您更快地添加箭頭功能。您可以使用??J / Ctrl+Alt+J使用它來包圍帶有箭頭功能的代碼塊。也可以輸入arf，然后按?/Tab展開模板，并添加一個空箭頭函數，如下圖。

調試時預覽文件

過去只對項目工具窗口中的文件起作用的預覽標簽現在對調試期間打開的文件起作用了。這可以幫助你避免當你停在斷點處或通過代碼步進時，多個文件在不同的選項卡中打開，從而污染編輯器。

如果你啟用了預覽功能，這些文件將全部連續出現在一個標簽頁中。你可以在 Preferences / Settings | Editor | General | Editor Tabs選項卡中打開這個功能。

====================================================

想要了解或購買WebStorm正版授權的朋友，歡迎

JetBrain技術交流群現已開通，QQ搜索群號“786598704”或者掃描下方二維碼即可加入