JetBrains is in major update mood, flinging out version 2020.3 of its JavaScript development IDE WebStorm. Just last week the company brought TeamCity and DataGrip up to date.
As keen observers of its customer base, the team behind WebStorm noted that CSS and HTML code inside JavaScript template literals had become more of a thing in recent months. To help keep the resulting code readable, it therefore implemented formatting support for multiline CSS and HTML blocks with JavaScript inside.
Meanwhile the newly added option to come up with templates for creating multiple files at once can help to make sure that you don’t forget to add test files for new .js files, for example.
Other productivity helpers in version 2020.3 include inline watches to reduce errors when switching contexts, and interactive inline hints which offer additional information and ways to change values. Teams keen on keeping their pair programming practice going while sitting side by side isn’t an option can also make use of the “Code With Me” service for collaborative development WebStorm should now be compatible with.
Since TypeScript is definitely here to stay, the TypeScript language service was integrated into the Problems tool window. The hope is to make the user interface less crowded and provide a central space to review critical code problems. Users taking advantage of version 3.0 of the Vue.js framework on other other hand will run into less issues, thanks to support for things like the <script setup> syntax and the defineComponent method.
Speaking of frameworks, Tailwind CSS has seen lots of interest in recent months, which prompted the WebStorm team to add support for the library. The seemingly highly requested feature provides things like autocompletion for Tailwind classes, suggestions when writing pseudo-class variants, and previews for the CSS resulting from class declarations in HTML and CSS files.
Catching up with some of the other JetBrains development environments, WebStorm 2020.3 comes sporting a new welcome screen which lets users create and open projects while also presenting options to tweak settings like the IDE’s theme and fonts used. There’s now also the option to split the editor included using drag and drop on tabs with special icons marking pinned tabs so you don’t lose sight of them too quickly.
To support the operational aspects of web development better, WebStorm 2020.3 has finally learned to support the Git staging area. Once enabled, changelists will be turned off and developers can stage files from within the IDE via the plus icon in the commit UI, the gutter, or Show Diff.
Working with branches is also supposed to have become easier, since WebStorm now corrects unaccepted symbols in new branch names, and displays actions for the currently selected branch. A renaming of Merge into Current to Pull into Current Using Merge and Rebase Current onto Selected to Pull into Current Using Rebase is meant to clarify what these actions entail.