WebStorm 2020.2版本是WebStorm今年的第二個重大更新，現已發布！它將Prettier作為默認格式化程序選項，能夠更好的支持Vue類，JavaScript，以及對GitHub pull請求的全面支持等等。

下載WebStorm2020.2最新試用版

如果您只有幾分鐘時間來探索WebStorm 2020.2的新增功能，請觀看此視頻。如果您想更深入地學習，請繼續閱讀！

新功能和改進屬于以下類別：

• 框架和技術：使用Prettier作為默認格式化程序的選項，對Vue.js進行了各種改進，并支持WSL 2中安裝的Git。
• JavaScript和TypeScript：新的智能意圖，呈現的JSDoc注釋，ML輔助的代碼完成和調試器增強。
• HTML和樣式表>：更好地支持Sass的模塊系統，WebP支持以及querySelector方法中CSS選擇器的代碼完成。
• 版本控制：對GitHub拉取請求的更高級支持，針對多個Git操作的重新設計的對話框，以及用于壓縮日志中提交的新操作。
• 代碼編輯：用于發現代碼中問題的新工具，以及用于在每一行的末尾添加插入符號的操作。

框架與技術

我們將盡可能地繼續使開發者在WebStorm中使用Prettier時更加容易。這次，我們將Prettier設置為默認格式器，而不是內置的格式器。現在，您所需要做的就是在“ Preferences / Settings” |“ Settings”中選擇“ Preferences/Settings | Languages & Frameworks | JavaScript | Prettier

選中“ code reformat”選項，只要您使用默認格式設置操作，就會調用Prettier 。默認情況下，WebStorm會將格式應用于all。在項目中編輯的js，.ts，.jsx和.tsx文件，就像在保存時運行Prettier時一樣。要將格式應用于其他文件類型，或將格式限制為僅位于特定目錄中的文件，可以使用glob模式自定義默認配置。

如果要在所有新項目中將Prettier用作默認格式化程序，請轉至File | New Projects Settings | Preferences/從主菜單中選擇Settings for New Projects，然后在其中選擇“On Code Reformat ”選項，并在需要時更新文件類型的默認列表。

如果您對舊的處理方式感到滿意–既使用內置格式化程序又使用“Reformat with Prettier”操作，該怎么辦？或者，如果您已經習慣了將自定義快捷方式分配給“ Reformat with Prettier”操作，該怎么辦？您當然可以繼續使用它。但是，您可能想嘗試一下新功能，看看它是否對您更好。

對Vue.js的最佳支持

WebStorm 2020.2還添加了對Nuxt.js的支持，Vue代碼樣式設置的專用部分以及其他一些改進。讓我們看看添加了什么。

對Nuxt.js的支持

首先，如果您使用的是從2.9.0開始的Nuxt版本，并且沒有安裝@ nuxt / types軟件包，則WebStorm會警告您，并建議將其安裝為dev依賴項。如果要在IDE中更好地完成代碼，請建議您這樣做。

現在，使用nuxt.config.js文件時，您將獲得正確的代碼完成建議。懸停時，您還將看到“ Documentation”彈出窗口，顯示該文件中使用的Nuxt選項的類型信息。

同時，也支持特定的Nuxt的Webpack設置。從Nuxt.js 2.12.0開始，WebStorm將自動找到webpack配置文件，并使用其中的模塊解析規則來提供編碼幫助。

IDE還可以識別對Vuex存儲的引用，并且可以正確解析并自動完成它們。

最后，Vue模板中引用的 static目錄中的所有內容也將得到正確解析。

Vue特定的代碼樣式設置

WebStorm 2020.2隨附一個專用部分，用于配置Vue文件的格式設置選項。新部分位于“ Preferences/Settings | Editor | Code Style | Vue。

使用Vue特定的代碼樣式設置，您應該選擇那些能快速選擇縮進頂級標簽的內容。您還可以決定整個Vue文件的縮進應該相同，還是取決于語言設置（例如特定于HTML）。默認情況下，僅<template>縮進內容，并且縮進對于整個文件是統一的。

您還可以更改在Vue代碼中格式化插值的方式。要配置任何其他代碼樣式選項，請在“Preferences/Settings | Editor | Code Style中轉到該語言的專用部分。

Vue的其他改進

除了這兩項主要增強功能之外，您還會發現更多其他功能，例如：

• 改進了TypeScript語言服務與.vue文件一起使用的方式。現在，它們像.ts或.tsx文件一樣。在其他Vue或TypeScript文件中導入Vue文件變得更加容易。
• WebStorm現在支持Vuelidate，這是Vue.js的基于模塊的驗證。
• Vuex存儲中的所有映射符號都已正確解析至函數/屬性中.，顯示了正確數量的參數和正確類型。
• 如果您Vue.extend()在使用單文件組件時嘗試創建一個組件，則現在將看到所有數據屬性均已按預期解析。
• 我們已經做了一個小的改進，以完成對實例的屬現在支持- $data，$props和$options。

接下來的文章我們將繼續詳細說明webstorm2020.2版本的新增和改進功能；