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

下載WebStorm 2021.2

功能和改進(jìn)列表分為以下幾類：

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

代碼編輯

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

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

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

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

內(nèi)置 HTML 預(yù)覽更新

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

保存操作

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

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

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

如果你想調(diào)整一個特定動作的設(shè)置，將鼠標(biāo)懸停在該動作上--你會看到一個鏈接，指向該動作的可用配置選項(xiàng)。點(diǎn)擊它就可以跳到IDE設(shè)置中的相關(guān)頁面。

暫存文件的改進(jìn)

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

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

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

Code With Me 的改進(jìn)

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

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

JavaScript 和 TypeScript

require() 的自動導(dǎo)入

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

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

支持 JSDoc 注釋中的 TypeScript 類型

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

添加箭頭功能的新動作

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

調(diào)試時預(yù)覽文件

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

如果你啟用了預(yù)覽功能，這些文件將全部連續(xù)出現(xiàn)在一個標(biāo)簽頁中。你可以在 Preferences / Settings | Editor | General | Editor Tabs選項(xiàng)卡中打開這個功能。

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

想要了解或購買WebStorm正版授權(quán)的朋友，歡迎

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