{"id":23575,"date":"2020-06-03T10:51:53","date_gmt":"2020-06-03T10:51:53","guid":{"rendered":"https:\/\/blog.jetbrains.com\/webstorm\/?p=11214"},"modified":"2020-08-26T15:38:16","modified_gmt":"2020-08-26T15:38:16","slug":"webstorm-2020-2-eap-2","status":"publish","type":"webstorm","link":"https:\/\/blog.jetbrains.com\/zh-hans\/webstorm\/2020\/06\/webstorm-2020-2-eap-2","title":{"rendered":"WebStorm 2020.2 EAP #2: Using Prettier as the Default Formatter, New Inspections Widget, and VCS Improvements"},"content":{"rendered":"<p><strong>WebStorm 2020.2 EAP build #2 is now available!<\/strong><\/p>\n<p>If you\u2019re unfamiliar with our Early Access Program or if you want to catch up on all the new features, check out our <a href=\"https:\/\/blog.jetbrains.com\/webstorm\/tag\/webstorm-2020-2\/\">previous EAP blog posts<\/a>.<\/p>\n<p>The <a href=\"https:\/\/www.jetbrains.com\/toolbox\/app\/\" target=\"_blank\" rel=\"noopener\">Toolbox App<\/a> is the easiest way to get the EAP builds and keep your stable WebStorm version and any EAP versions up to date. Or you can download the EAP builds from our <a href=\"https:\/\/www.jetbrains.com\/webstorm\/nextversion\/\" target=\"_blank\" rel=\"noopener\">website<\/a>. You can also choose to be notified right from the IDE when a new EAP build is available: go to <em>Preferences\/Settings | Appearance &amp; Behavior | System Settings | Updates<\/em> and select <em>Automatically check updates for Early Access Program<\/em>.<\/p>\n<p align=\"center\"><a class=\"jb-download-button\" href=\"https:\/\/www.jetbrains.com\/webstorm\/nextversion\" target=\"_blank\" rel=\"noopener\">DOWNLOAD WEBSTORM 2020.2 EAP<\/a><\/p>\n<p><strong>Important! WebStorm EAP builds are not fully tested and might be unstable.<\/strong><\/p>\n<p>Here are some of the highlights of WebStorm 2020.2 EAP #2 (build 202.5103.5). For the full list of issues fixed in this update, see the <a href=\"https:\/\/confluence.jetbrains.com\/display\/WI\/WebStorm+202.5103.5+Release+Notes\" target=\"_blank\" rel=\"noopener\">release notes<\/a>.<\/p>\n<h2 id=\"using_prettier_as_the_default_formatter\">Using Prettier as the default formatter<\/h2>\n<p>We continue to make the experience of working with Prettier as seamless as possible for WebStorm users. In addition to the <a href=\"https:\/\/blog.jetbrains.com\/webstorm\/2020\/04\/webstorm-2020-1\/#tools\">recently added option<\/a> for running Prettier on save, we\u2019ve made it easier to use Prettier with the <a href=\"https:\/\/www.jetbrains.com\/help\/webstorm\/reformat-and-rearrange-code.html#\" target=\"_blank\" rel=\"noopener\">default formatting action<\/a>. Now, if you don\u2019t rely on the built-in formatter and want to use Prettier instead, you can tick the <em>On code reformat<\/em> option in <em>Preferences\/Settings | Languages &amp; Frameworks | JavaScript | Prettier<\/em>.<!--more--><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2020\/06\/webstorm-prettier-settings.png\" alt=\"prettier-settings\" width=\"600\" \/><\/p>\n<p>With the new option checked, Prettier will be invoked whenever you use the default formatting action (<em>Alt+Cmd+L\/Alt+Ctrl+L<\/em>). By default, WebStorm will apply formatting to all <em>.js<\/em>, <em>.ts<\/em>, <em>.jsx<\/em>, and <em>.tsx<\/em> files that you\u2019ve edited in your project, just like it does for running Prettier on save. To apply the formatting to other file types, or to files located in specific directories only, you can customize the default configuration by using <a href=\"https:\/\/github.com\/isaacs\/node-glob\" target=\"_blank\" rel=\"noopener\">glob patterns<\/a>.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2020\/06\/webstorm-reformat-code-prettier-default.png\" alt=\"reformat-code-prettier-default\" width=\"600\" data-gif-src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2020\/06\/webstorm-reformat-code-prettier-default.gif\" \/><\/p>\n<p>If you want to have Prettier set as the default formatter in <strong>all new projects<\/strong>, then from the main menu, go to <em>File | New Projects Settings | Preferences\/Settings for New Projects<\/em> and select the same option from there, updating the default list of file types if needed.<\/p>\n<p>Lastly, what if you\u2019re happy with the old way of doing things, such as having both the built-in formatter and the <i>Reformat with Prettier<\/i> action (<i>Alt+Shift+Cmd+P\/Ctrl+Alt+Shift+P<\/i>)? Or what if you have a custom shortcut assigned to the <i>Reformat with Prettier<\/i> action that you\u2019ve gotten used to? You can, of course, keep using it. However, you may want to give the new functionality a go to see if it works better for you.<\/p>\n<h2 id=\"new_widget_for_going_over_problems_in_your_code\">New widget for going over problems in your code<\/h2>\n<p>WebStorm 2020.2 comes with the new <em>Inspections<\/em> widget located in the top right-hand corner of the editor. This widget provides detailed information about the number of warnings, errors, and other issues in the current file, making it easier for you to view all the problems and navigate between them. For navigation, you can use the arrow icons or <em>F2<\/em>.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2020\/06\/webstorm-inspections-widget.png\" alt=\"inspections-widget\" width=\"600\" \/><\/p>\n<p>You can also configure the highlighting level right from the new widget, choosing between <i>None<\/i>, <i>Errors Only<\/i>, and <i>All Problems<\/i>. It was already possible to do this by using the <i>Inspector<\/i> icon on the status bar or the icon in the top right-hand corner of the file, however it was harder to discover this functionality.<\/p>\n<h2 id=\"squashing_local_commits_from_the_log\">Squashing local commits from the log<\/h2>\n<p>Speaking of changes in the <em>Version Control<\/em> subsystem, you can now select a number of local commits in the <em>Log<\/em> tab of the <em>Git<\/em> tool window and squash them into one. This action is available from the context menu, which can be invoked with a right-click.<\/p>\n<h2 id=\"better_presentation_of_results_when_comparing_branches\">Better presentation of results when comparing branches<\/h2>\n<p>We\u2019ve also improved the way the result of the <em>Compare branches <\/em>action is presented. When comparing two branches in WebStorm, the IDE will now open the logs of those branches in the editor instead of the <em>Git<\/em> tool window. This will ensure that there is enough space to display all the information.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2020\/06\/webstorm-VCSCompareBranches.png\" alt=\"VCS-compare-branches\" width=\"600\" \/><\/p>\n<p>That\u2019s it in terms of the biggest highlights. We\u2019ve also decided to deprecate support for the JavaFX runtime for plugins in the IntelliJ Platform. As an alternative to JavaFX APIs, we provide a new integration with JCEF which offers better stability and performance. It also simplifies the implementation of new features that show web content in the IDE. For you, it will only result in a slightly different rendering of preview for <em>.md<\/em> files and JavaScript debug console.<\/p>\n<p>Please report any issues you find to our <a href=\"https:\/\/youtrack.jetbrains.com\/issues\/WEB\" target=\"_blank\" rel=\"noopener\">issue tracker<\/a>. And stay tuned for next week\u2019s update!<\/p>\n<p><em>The WebStorm team<\/em><\/p>\n","protected":false},"author":989,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","categories":[826],"tags":[91,2876],"cross-post-tag":[],"acf":[],"_links":{"self":[{"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/webstorm\/23575"}],"collection":[{"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/webstorm"}],"about":[{"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/types\/webstorm"}],"author":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/users\/989"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/comments?post=23575"}],"version-history":[{"count":1,"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/webstorm\/23575\/revisions"}],"predecessor-version":[{"id":69225,"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/webstorm\/23575\/revisions\/69225"}],"wp:attachment":[{"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/media?parent=23575"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/categories?post=23575"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/tags?post=23575"},{"taxonomy":"cross-post-tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/zh-hans\/wp-json\/wp\/v2\/cross-post-tag?post=23575"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}