AppCode
CLion
DataGrip
GoLand
IntelliJ IDEA
MPS
PhpStorm
PyCharm
Rider
RubyMine
WebStorm
Toolbox App
.NET Tools
ReSharper C++
Space
TeamCity
Upsource
YouTrack
HubWebStorm 2017.2 released: Move symbol refactoring, import code style from ESLint, better webpack support, and more
Posted on by
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!
https://www.youtube.com/watch?v=XZTvUJqJvTY
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.
JetBrains WebStorm Team
Comments below can no longer be edited.
sj says:
July 17, 2017The 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:
July 17, 2017It’s going to be fixed in WebStorm 2017.2.1. The Early Preview build will probably be available next week. Sorry for the inconvenience.
Yuri says:
July 17, 2017I 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:
July 17, 2017Have 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:
July 17, 2017Thanks, 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.
Lush says:
July 17, 2017With 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:
July 18, 2017Can you please try to set the font to default in Settings | Appearance & Behavior | Appearance – Override default font and restart the IDE. Thanks!
Ekaterina Prigara says:
July 18, 2017If it doesn’t help, in the menu Help select Edit Custom VM Options and add -Dsun.java2d.uiScale.enabled=false
Then restart the IDE.
Lush says:
July 18, 2017Adding to the VM Options fixed it! Thank you very much!!
Lush says:
July 18, 2017I 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:
July 18, 2017All 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.
Nazar says:
July 18, 2017I 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.
Ekaterina Prigara says:
July 18, 2017Sorry, we can’t reproduce it. Can you please share your IDE logs (menu Help – Show logs) with us. You can post a link here or report a new issue on our issue tracker: https://youtrack.jetbrains.com/issues/WEB
Thanks!
Nazar says:
July 19, 2017Thank you Ekaterina. I created WEB-27873 and attached my log file there.
Hope it helps.
Martin says:
July 19, 2017Hey 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!
Ekaterina Prigara says:
July 19, 2017Thanks!
Sorry, it works only with .eslintrc in the JSON format. We can’t statically analyse a JavaScript configuration.
wube says:
July 20, 2017@Ekaterina Prigara
Is there any reason why you can’t use:
eslint -c .eslintrc.js –print-config
This command returns an eslint config parsed with eslint as JSON – which can by statically analysed.
Ekaterina Prigara says:
July 20, 2017Thanks for the tip and for reporting an issue. Didn’t know about that.
zhenyong says:
July 25, 2017Is there any place to discuss or vote for webstorm next function?
Ekaterina Prigara says:
July 25, 2017You can vote for the features on our issue tracker: https://youtrack.jetbrains.com/issues/WEB
If you’re particularly interested in the issue about eslintrc.js, here it is: https://youtrack.jetbrains.com/issue/WEB-27908
wube says:
July 20, 2017@Martin
Yes. Only .eslintrc files are supported. And only rules present in the .eslintrc file. Extends are not supported.
zhenyong says:
July 25, 2017You can write eslintrc.js in project and use
eslint --print-file ./eslintrc.jsto print whole static config and write to file .eslintrc.Here convenient gist code：
https://gist.github.com/zhenyong/6303b2ccfb365c50ef16c0e48a86877e
Pablo Rodríguez says:
July 19, 2017The “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.
Ekaterina Prigara says:
July 20, 2017Can you please try the workaround described in this comment: https://youtrack.jetbrains.com/issue/IDEA-176186#comment=27-2332008
Thanks!
Mihail says:
July 20, 2017I 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:
July 21, 2017This 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:
July 23, 2017It 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:
July 25, 2017As I’ve said, Ctrl-D is a default for both actions. Have you tried removing the assignment as I’ve suggested? Thanks!
Mihail says:
August 12, 2017The bug has been fixed as of 2017.2.1. Thanks!
MirekSz says:
July 24, 2017“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
lena_spb says:
July 24, 2017Please feel free to file a request for this feature to youtrack, https://youtrack.jetbrains.com/issues/WEB
MirekSz says:
July 24, 2017https://youtrack.jetbrains.com/issue/WEB-27961
Daniel Miclos says:
July 24, 2017is this still compatible with osx 10.10.5? I hangs on start after the update. I tested in two different macs.
Ekaterina Prigara says:
July 25, 2017Java 8 that WebStorm uses is compatible with macOS 10.8.3 or above. We haven’t tested it with earlier macOS versions.
DANIEL MICLOS says:
July 25, 2017Yes, great, but as I said, I’m using 10.10.5. And my Java is updated to the last release. I just tried and none of the IDEs works after updating. They hang when they are about to show the project windows.
Ekaterina Prigara says:
July 25, 2017Sorry, misread the OS version. As I’ve said, we have only tested on macOS 10.11 and 10.12. Can you please send us the IDE logs located in ~/Library/Logs/WebStorm2017.2
Any chance you have any 3rd-party plugins installed? Thanks!
DANIEL MICLOS says:
July 25, 2017Sure, here is a Dropbox link with two .log files from two different machines:
https://www.dropbox.com/s/dm02hh5nqam9rxm/java_error_in_webstorm_4146.log?dl=0
Ekaterina Prigara says:
July 27, 2017Thank you! Found a related issue on our issue tracker: https://youtrack.jetbrains.com/issue/JRE-407
Can you please try the workaround suggested here: https://youtrack.jetbrains.com/issue/JRE-407#comment=27-2305435
kaka says:
August 7, 2017how do i turn these things off? https://drive.google.com/open?id=0B7Rg7l5e2Y3yaENVQlZ6QzhFbzg
so messi
Ekaterina Prigara says:
August 7, 2017You can disable Parameter hints in Preferences | Editor | General | Appearance – Show parameter name hints.
kaka says:
August 8, 2017tks alot
Gor says:
August 10, 2017Using CTR+SHIFT+F10 is not picking the right testing configuration for my mocha files. It uses Karma and tries to run it in the browser, whereas I want it to run with my Mocha default configuration.
Jasmine tests are fine.
Used to work in 2017.1
Ekaterina Prigara says:
August 10, 2017Do you have both karma and mocha listed in your project’s package.json file?
Gor says:
August 10, 2017Yes, we have both jasmine and mocha tests at the moment.
lena_spb says:
August 11, 2017The logic used for determining what test runner is available for a given test file is based on dependencies declarations in package.json nearest to the current test file.
If you have a single package.json, with both
'karma'and'mocha'dependencies included, and there is a karma config in your project, karma is preferred – see https://youtrack.jetbrains.com/issue/WEB-26070#comment=27-2088951. To force using Mocha test runner for files in a certain directory, create a Mocha run configuration with"Test directory"set to this directory.Tim says:
October 3, 2017Hi folks I have a problem. In 2017.2 broken “Autoscroll from Source” in “Project” window.
Working on MacOS Siera.
I tried 2017.3 – it’s won’t work too. In 2017.1 everything is fine.
Ekaterina Prigara says:
October 3, 2017Copying the reply from Twitter: “Haven’t reproduced it so far in WS2017.2.4 on macOS. It doesn’t work all the time, does it? Do you have any plugins installed?”