WebStorm 2017.1 EAP, 171.2822: Vue support, trailing comma, Dart improvements

A new Early Access Preview build for WebStorm 2017.1 (171.2822.13) is now available! You can download it here and install it side-by-side with your current stable WebStorm version, or if you have the previous EAP build, you should soon get a notification in the IDE about a patch update.

Initial support for Vue

We’re glad to announce that we are working on Vue.js support in WebStorm (and the plugin is open source, so you’re welcome to contribute). Here’s what you can already try:

Support for script, style and template blocks in .vue files.
You’ll have code completion for ECMAScript 6 by default inside script block and CSS inside style block. WebStorm understands lang attribute inside these tags and allows you to use TypeScript, Pug and CSS-preprocessors instead.


Support for the Vue template syntax.
You can get completion for the Vue directives in templates.


Trailing commas in JavaScript and TypeScript

You can now configure whether you’d like to use trailing commas in objects, arrays and for the parameters in method definitions and calls. You can find this code style option under Preferences | Editor | Code Style – JavaScript or TypeScript – Other.


In addition to that we also added a new code style scheme compatible with the Google JavaScript code style. You can select it for your project in Preferences | Editor | Code Style – JavaScript – Set from – Predefined code style – Google JavaScript Style Guide.

Improvements in Dart support

With WebStorm 2017.1 you can now debug Dart VM tests. To start debugging simply right-click on a test folder, a test suite or an individual test in the source code and select Debug.

It is also now possible to configure Dart SDK path for each individual project.

You can find the full list of issues addressed in this EAP build in the Release notes.

Learn more about other new features in WebStorm 2017.1:

  • WebStorm 2017.1 EAP, 171.1834: Run Mocha tests with the gutter icon; The test status is now shown right next to the test; Integration with the Angular language service; Linters are now detected and enabled by default for the new projects; Support for emoji in the editor; Zero-latency typing is now enabled by default.
  • WebStorm 2017.1 EAP, 171.2014: New intentions that convert forEach and for..in iterations over arrays to for..of; Code style options for quotes and ternary operators; New inspection Equality operator may cause type coercion.
  • WebStorm 2017.1 EAP, 171.2271: Standard code style; Completion in package.json.
  • WebStorm 2017.1 EAP, 171.2455: Improved integration with TSLint; Code style options for the use of semicolons in JavaScript and TypeScript.

Please report your feedback to our issue tracker. To get notifications of new EAP builds as they become available, subscribe to the EAP channel in Preferences | Appearance & Behavior | System Settings | Updates.

Your 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 Early Access Preview and tagged , , . Bookmark the permalink.

45 Responses to WebStorm 2017.1 EAP, 171.2822: Vue support, trailing comma, Dart improvements

  1. Julian says:

    Absolutely amazing that Vue.js support. Thank you so much!

  2. naveed says:

    Awesome! Thank you!

  3. jbbr says:

    Thanks, Vue.js support is a great feature

  4. winiex says:

    Great job! I’ve been waited for VueJS support for a long time. Now I can be more productive. :)

  5. Uur says:

    vue.js support in ws, it sounds awesome, thank you guys.

  6. Nikola Kostadinov says:

    Thanks for the Vue support ! Really needed this.

  7. Ratish Mohan Ratusaria says:

    Awesome! What are the plans for its final release?

    • Ekaterina Prigara says:

      We are planning to release WebStorm 2017.1 at the end of March. We hope to add more features to the Vue support by that time.

  8. yeatszhang says:

    Thanks for the Vue support ! Really needed this.

  9. KS says:

    Love the Vue luv!

  10. Michael Jason says:

    Vue.js support Awesome… Looking forward to improvements on this… Awesome again…

  11. Lucas Silva says:

    Thanks for support Vue.js!

  12. Marius says:

    Thank your for adding Vue.js support!
    I assume this will also be included in IDEA, correct?

  13. Paul says:

    Thanks so much for Vue.js support. That’s absolutely critical for anything I work on these days! Nicely done.

  14. Hardy says:

    Thanks for adding support for Vue.js. Been waiting for this for a while.

  15. Woohoo, Vue support — thanks!

  16. A big THANK YOU to the JetBrains team for putting the investment and work in for Vue support. Vue is an incredible framework and will be our primary – fantastic to have IDE support baked in!

  17. Pavel says:

    Will the vue syntax support be available in the PHPStorm?

  18. Yasser Hussain says:

    I still don’t see any support for vue. I chose ES6 from Languages. What am I misssing?

  19. David Arutynyan says:

    What the hack with vue.js support?
    See example please: http://imgur.com/a/MuzqI
    And docs example: http://imgur.com/a/rwVLR
    It doesn’t recognize :duration expression for example, also vue attributes

  20. ibufu says:

    Hi, I am using Webstorm 2017.1.
    And it is my code below:

    But, it seem to Webstorm still can’t support SASS in .vue file.

  21. Gin says:

    when I use this version’s webstorm to do some vue.js work, there is a file named as Navbar.vue, and webstorm only recognize it as “file” type, not like the others as “html” type or “vue” type, so that I can’t use grammer detectors in it.
    Is this the only problem of me ?

    • Ekaterina Prigara says:

      Can you please check that this file is not listed in the ignore list in Preferences | Editor | File types or not associated with the Text file type.

  22. candyzheng says:

    There is a problem!
    when i use vue plugin, there are some conflicts i think which is related to this plugin,like this.

    it throw an webstorm editorconfig error ‘expecting newline or semicolon’,i think vue plugin considered it as a vue template data obj.

    but when i use

    the problem just gone
    you can see the code change here “‘支持案由、法院、部门、法官检索'”,and i think vue plugin considered it as a string but not a vue template data obj.

    I found input node value attribute has the same problem

    but this problem dose not happen in class attribute and some other html attributes.

  23. me says:

    there’s something deficiency,for example,I can’t create a new vue file(*.vue) with Right Click Menus,We hope “WebStorm” can surrport that,thank you,very like the “WebStorm”.

    • Ekaterina Prigara says:

      Sorry, we don’t have file templates for all languages WebStorm supports, but it’s very easy to add your custom file templates that will be available in this list – just select Edit File Templates in this popup and then add a template.

      • Asher says:

        get it, thank you very much. How can I change the Icon of the “*.vue” file, I think use the Vue’s Icon will be better than the Html’s Icon.

        • Ekaterina Prigara says:

          Unfortunately, you can’t change icons. Only by making a custom plugin. But thank you for your feedback, we’ll think about changing it.

  24. Tobias Vetter says:

    It looks like tslint does not work within vue files.

  25. bargan says:

    I have experienced recently a phpStorm crash, I had to restart it but all my settings were lost (luckily I had saved previously the settings).
    The main problem that I have right now is that I have lost some useful features for vue files:
    1) autocomplete
    2) auto-comment(ctrl+ /) is adding HTML comment even if I am using for CSS or javascript
    3) auto indent key combination

    Basically, the .vue extension is not recognized as before!
    P.S I have uninstalled and install the vue plugin.

    Thank you

    • Ekaterina Prigara says:

      Please check that you have installed the right plugin – there are two Vue plugins in our plugin repository right one – one developed by JetBrains and another developed by a third-party. You can check the vendor in Preferences | Plugins.
      Another thing to do is to check that .vue file extension is not associated with the wrong file type, e.g. Text in Preferences | Editor | File Types.
      Hope it helps!

Leave a Reply to candyzheng Cancel reply

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