WebStorm 2017.2 released: Move symbol refactoring, import code style from ESLint, better webpack support, and more

Today we’re announcing WebStorm 2017.2  🎉

This big summer update adds powerful Move symbol refactoring, supports new code style options for JavaScript and TypeScript, improves testing with Karma and Mocha, and much more!

Here’s what you can do with the top new features in WebStorm 2017.2:

  • Import code style from an ESLint configuration.
  • Run single Karma tests and generate code coverage reports for Mocha.
  • Take advantage of code completion in JavaScript that respects the project configuration stored in your webpack.config.js file.
  • Order code inside classes with the Rearrange code action.
  • See Parameter hints and inferred type info in TypeScript.
  • Build interfaces with support for Angular Material.
  • Enjoy better code completion and navigation for Sass selectors.
  • Scope styles for single components with support for CSS Modules.

Explore all the new features of WebStorm 2017.2 on our website.


Download WebStorm 2017.2

JetBrains WebStorm Team

About Ekaterina Prigara

Ekaterina Prigara is WebStorm product marketing manager at JetBrains. She's passionate about new technologies, UX and coffee.
This entry was posted in Release Announcements and tagged , , , , . Bookmark the permalink.

36 Responses to WebStorm 2017.2 released: Move symbol refactoring, import code style from ESLint, better webpack support, and more

  1. sj says:

    The issue with tabs limit is still present even in the new release.
    Do you have an ETA? It is logged at https://youtrack.jetbrains.com/issue/IDEA-173369
    It is a really disruptive bug that ruins the workflow for people who keep a single tab open and there were hopes it would be fixed with the next release.
    Thank you in advance for you help.

    • Ekaterina Prigara says:

      It’s going to be fixed in WebStorm 2017.2.1. The Early Preview build will probably be available next week. Sorry for the inconvenience.

  2. Yuri says:

    I know there is Vue.Js support, and I know there is Post CSS support. However, I stumbled on combining the two. How do I make WebStorm understand that the tag in the .vue file, should be treated as post css, so nesting is legal and etc.

    • Ekaterina Prigara says:

      Have you tried that in WebStorm 2017.2? To enable PostCSS support you can either set PostCSS as a dialect for stylesheets in Preferences | Languages & Frameworks | Stylesheets or add lang="postcss" attribute to the style tag. Make sure PostCSS plugin is installed and updated.

      • Yuri says:

        Thanks, works now. I didn’t see that lang part documented, but I actually did guess to try it, it didn’t work so I assumed this feature doesn’t exist.
        However, it turns out, my problem was I had ‘type=”text/css” ‘ on the style tag, which for some reason stops this feature from working.

  3. Lush says:

    With this newest update, the entire WebStorm window is MASSIVE!! All of my files, menu items, project trees, search boxes, etc – EVERYTHING – is sooooo annoyingly huge!

    What happened with this update? This is impossible to work with – everything on my screen is monumentally large, and changing font size or other settings relating to size does nothing.

    Is this a bug that will be fixed? Like immediately?

    • Ekaterina Prigara says:

      Can you please try to set the font to default in Settings | Appearance & Behavior | Appearance – Override default font and restart the IDE. Thanks!

  4. Lush says:

    I left a comment, and it looks like it was deleted by mods – don’t understand why, but I am leaving it again…

    With this newest update, the entire WebStorm window is MASSIVE!! All of my files, menu items, project trees, search boxes, etc – EVERYTHING – is sooooo annoyingly huge!

    What happened with this update? This is impossible to work with – everything on my screen is monumentally large, and changing font size or other settings relating to size does nothing.

    • Ekaterina Prigara says:

      All new comments are approved by the moderators before they become visible. Both your comments are now live. I’ve left a reply for the first comment.

  5. Nazar says:

    I had to rollback to https://download.jetbrains.com/webstorm/WebStorm-2017.1.4.dmg due to a bug in searching for css classes.

    When I select a class in an HTML file (i.e. class=”empty-list-here” with the selection being the text inside “, the Edit -> Find -> Find in path dialog does not come up.

  6. Martin says:

    Hey great work on the update!

    Does the Import auf ESLint Settings only work with .eslintrc files?
    ESLint allows it’s configuration file to be normal javascript and .eslintrc.js and I don’t get a prompt to import my ESLint settings.

    Thanks!

  7. Pablo Rodríguez says:

    The “Go to file” menu (Ctrl + Shift + N) is bugged for me on Ubuntu 16.04. It randomly disappears and it’s quite annoying. I’ll probably roll back until this is fixed.

  8. Mihail says:

    I have a problem. When I try to do duplicate a line using Ctrl+D, I expect that there will be a duplicated line.
    So say console.log(“Hello World”); becomes

    console.log(“Hello World”);
    console.log(“Hello World”);

    Instead, I get taken to Compare With window which apparently has the same shortcut. When I tried to look this stuff up in the settings it had it showed me that it was still Ctrl+D! For Compare With it showed no shortcut at all! So can you update the shortcuts or fix this?

    • Ekaterina Prigara says:

      This shortcut depends on the context: when the focus is on the editor, it duplicated the line, but when the focus is on the project view or on a navigation bar, it opens Compare with window.
      In the Settings | Keymap I see this shortcut assigned to the Compare files action for default Windows keymap. If you still want to remove the assignment, please try to make a new copy of the default keymap and modify it.

      • Mihail says:

        It now gives Ctrl+D for both of them, but it still opens the compare with window regardless of where the cursor is located when I press the Ctrl+D key. And besides, I usually keep my sidebar closed because I have little use for it.

        • Ekaterina Prigara says:

          As I’ve said, Ctrl-D is a default for both actions. Have you tried removing the assignment as I’ve suggested? Thanks!

  9. MirekSz says:

    “Parameter hints and type info in TypeScript” super cool but do you plan parameter hints could be also available in pure JS maybe with @JSDoc

  10. Daniel Miclos says:

    is this still compatible with osx 10.10.5? I hangs on start after the update. I tested in two different macs.

Leave a Reply

Your email address will not be published. Required fields are marked *