WebStorm 2021.3 EAP build #4 現(xiàn)已推出！本文主要講述WebStorm 2021.3 EAP build #4的所有新功能。

下載WebStorm

我們改進(jìn)了 HTML 中代碼完成的工作方式，包括常規(guī)文件以及 Vue 和 Angular 模板。現(xiàn)在，只要您在編輯器中輸入標(biāo)簽名稱或縮寫，或者調(diào)用代碼完成，WebStorm 都會立即向您顯示相關(guān)建議。以前，它只會在您先輸入< 時(shí)顯示它們。我們意識到這對于不習(xí)慣輸入<和> 的人和不熟悉 Emmet 的人來說不是很舒服。

正如您從 gif 中看到的，我們還改進(jìn)了字符實(shí)體引用的代碼完成。每當(dāng)您鍵入& 時(shí)，代碼完成彈出窗口就會出現(xiàn)。當(dāng)您繼續(xù)輸入時(shí)，最重要的建議會被選中，您可以按Enter以自動完成它。

您可能已經(jīng)注意到，HTML 中代碼完成的行為發(fā)生了一些變化——在某些情況下，您現(xiàn)在必須先選擇建議。我們希望您覺得它很直觀。

更新包的新檢查

多年來，我們一直在添加功能以幫助您從package.json文件添加和更新包，以及幫助您獲取有關(guān)這些包的相關(guān)信息。在此版本中，我們進(jìn)行了一些更改，應(yīng)該可以更輕松地管理項(xiàng)目依賴項(xiàng)。

您現(xiàn)在可以直接從編輯器將 npm 包更新到最新版本。打開package.json文件，將插入符號放在要更新的包版本上，然后按?? / Alt+Enter并選擇Update 'package name' to the latest version。當(dāng)您將鼠標(biāo)懸停在軟件包版本上時(shí)，還會顯示快速修復(fù)。

默認(rèn)情況下，新檢查僅提供快速修復(fù)，不會以任何方式突出顯示過時(shí)的包。如果您希望警告更加突出，您可以在Preferences / Settings | 中更改檢查嚴(yán)重性級別。編輯 | 檢查- 在那里查找更新 package.json 依賴項(xiàng)。

以前，WebStorm 將允許您通過Preferences / Settings | 中的相應(yīng)部分來管理您的包。語言和框架 | Node.js 和 NPM。由于只有少數(shù)用戶以這種方式管理他們的包，我們決定刪除此部分并引入一種更直接的方式來處理任務(wù)——上述新檢查。

最后，我們將Preferences / Settings 中的Node.js 和 NPM部分重命名為Node.js以避免任何混淆。和以前一樣，您可以使用它來選擇 Node 解釋器和您選擇的包管理器：npm、pnpm 或 Yarn。

能夠拆分運(yùn)行工具窗口

您現(xiàn)在可以拆分運(yùn)行工具窗口！當(dāng)您運(yùn)行多個(gè)配置并希望同時(shí)查看它們的結(jié)果時(shí)，這會很有用。要拆分運(yùn)行工具窗口，請將所需選項(xiàng)卡拖放到突出顯示的區(qū)域。您可以將選項(xiàng)卡拖回以取消拆分工具窗口或右鍵單擊頂部窗格并從上下文菜單中選擇取消拆分。

.js和.d.ts文件之間更好的映射

以下是有關(guān) JavaScript 文件導(dǎo)航如何工作的更多詳細(xì)信息：

• 如果類型定義安裝在@types文件夾中，WebStorm 將在使用Go To Declaration 或Usages操作（?B / Ctrl+B）時(shí)嘗試導(dǎo)航到庫的 JavaScript 源。請注意，這僅適用于在.d.ts文件中定義為類、變量或函數(shù)的符號。這不適用于接口或類型。
• 如果模塊內(nèi)的類型定義可用，WebStorm 默認(rèn)不會索引 JavaScript 源代碼，因此將無法導(dǎo)航到它。要索引此類文件，您可以先使用Go To Implementation ( ??B / Ctrl+Alt+B )，然后在看到Include Package彈出窗口時(shí)回答Yes。完成后，Go To Declaration 或 Usages將嘗試將您帶到庫源。關(guān)于.d.ts 中定義的相同限制適用。

對于 TypeScript 文件，它的工作方式如下：

• 轉(zhuǎn)到聲明或用法將帶您到 . d.ts文件，如果它可以被映射。
• 如果可以定位和映射，Go To Implementation將帶您到模塊的.js源。

在此版本中，我們修復(fù)了一系列與.js和.d.ts文件之間的映射相關(guān)的問題，并添加了用于在它們之間快速導(dǎo)航的裝訂線圖標(biāo)。

請注意：

• 該功能可能仍然無法在所有情況下工作。如果您發(fā)現(xiàn)它不適用于項(xiàng)目中包含的 JavaScript 源文件的情況，請?jiān)诖颂巹?chuàng)建一個(gè)新問題并附上代碼示例。
• 從導(dǎo)入聲明導(dǎo)航當(dāng)前僅適用于.d.ts文件。如果您覺得這不方便，請?jiān)诖颂幇l(fā)表評論。

輔助功能更新

最后但并非最不重要的一點(diǎn)是，我們解決了一些可訪問性問題，以使在屏幕閱讀器模式下工作更加舒適。我們禁用了過去出現(xiàn)在鼠標(biāo)懸停時(shí)出現(xiàn)的工具窗口小部件彈出窗口 ( IDEA-27815 ) 和快速文檔彈出窗口 ( IDEA-274143 )。我們還修復(fù)了調(diào)用Go To Declaration 或Usages彈出窗口 ( IDEA-272536 ) 的問題。

macOS 上的輔助功能支持也得到了改進(jìn)。我們已經(jīng)解決了畫外音焦點(diǎn) ( IDEA-273021 ) 的幾個(gè)問題，并使使用屏幕閱讀器 ( IDEA-185260 )創(chuàng)建項(xiàng)目成為可能。

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