WebStorm 2019.3 Early Access Program and Roadmap

Over a month ago, WebStorm 2019.2 went live. Since then, we’ve released two bug-fix updates, WebStorm 2019.2.1 and WebStorm 2019.2.2, and started to work on WebStorm 2019.3, which is scheduled for release at the end of November. It’s now time to share our plans for the upcoming release and announce the start of the Early Access Program.

Continue reading

Posted in Early Access Preview | Tagged , | 2 Comments

WebStorm 2019.2.2 is available

WebStorm 2019.2.2, the second bug-fix update for WebStorm 2019.2, is now available!

Update to it using Toolbox App, or from the IDE. You can also download WebStorm 2019.2.2 from our website.

What’s fixed:

  • CORS problem when debugging in Chrome caused by the x-ijt header was fixed (WEB-30191)
  • Working directory is now set automatically when running a JavaScript scratch file with Node.js (WEB-38037)
  • File watchers that reformat the code now better handle cases when file and class are renamed (WEB-33502)
  • Shortcut for the “Stretch to Left” action for resizing Project View now works again (IDEA-218926)
  • Problem with saving updated settings for new projects was fixed (IDEA-211731)

You can find a full list of issues addressed in WebStorm 2019.2.2 in the release notes.

The WebStorm Team

Posted in Release Announcements | Tagged , | Leave a comment

Using TypeScript to check your JavaScript code

There are several things WebStorm can do to help you find potential problems in your JavaScript code and improve its quality.

First, there are dozens of smart built-in inspections that check your code as you type and offer various quick-fixes for the problems they detect. Second, you can see warnings and errors from linters like ESLint right in the editor. Third, you can use Flow in your project.

One more option that we’re going to talk about in this blog post is using TypeScript for checking your JavaScript code.

TypeScript is a superset of JavaScript (more precisely, of its latest specification, ECMAScript 2019). That allows the TypeScript language service (which you actually get when you run npm install typescript) to check your JavaScript code as if it were untyped TypeScript code.

TypeScript error in JavaScript file

Here’s how you can enable TypeScript in your JavaScript project, and see errors and warnings from it in WebStorm:

Add a tsconfig.json file

tsconfig.json is a configuration file that TypeScript uses. In it, you can provide information about your project to TypeScript and specify what sort of checking you want to do. In TypeScript projects, the file also describes how the code should be compiled, but that’s not what we are interested in right now.

Continue reading

Posted in Tutorials | Tagged , , | Leave a comment

WebStorm 2019.2.1 is available

WebStorm 2019.2.1, the first bug-fix update for the recently released WebStorm 2019.2, is now available!

Update to it using Toolbox App, or from the IDE. You can also download WebStorm 2019.2.1 from our website.

Apart from bug fixes, this update also brings a lot of improvements and features. Here’s what’s new in WebStorm 2019.2.1:

  • In Angular projects, a different TSLint configuration specified in the angular.json file can be used for test files (WEB-33171)
  • Better support for Vue components with TypeScript decorators (WEB-31693)
  • Improved suggestions for scoped packages in package.json (WEB-34628)
  • Support for CSS Media Queries Level 5 (WEB-36265)
  • “Duplicate declaration” inspection now works for TypeScript (WEB-40037)

What’s fixed:

  • False-positive “Mismatched property value” error in SCSS and Sass files was fixed (WEB-40241)
  • Invalid item no longer appears in the code completion suggestions (WEB-39612)
  • Move refactoring now allows moving symbols between .ts and .tsx files (WEB-29039)
  • Tabs inside JSDoc are now preserved when formatting the code (WEB-15618)
  • Problems with typing some symbols using AltGr were fixed (JBR-1743,
    JBR-1744)

You can find a full list of issues addressed in WebStorm 2019.2.1 in the release notes.

The WebStorm Team

Posted in Release Announcements | Tagged , | 5 Comments

WebStorm 2019.1.4 is available

WebStorm 2019.1.4 is now available!

You can update using Toolbox App or from the IDE. You can also download these updates from our website.

Here are some of the fixes and improvements available in WebStorm 2019.1.4:

  • Several problems and performance issues when working with Angular projects were fixed (WEB-39587WEB-39085WEB-39115, WEB-39460, and more)
  • It’s now again possible to use the detached editor on macOS (IDEA-189984)
  • The IDE no longer loses focus after pressing Esc in the Find in Path dialog (IDEA-215107)
  • Problem with adding braces in the attribute value in CoffeeScript was fixed (WEB-39059)

Please also see the Release Notes.

Last week we have released WebStorm 2019.2. This major update brings a lot of new features and improvements, including those that are available in WebStorm 2019.1.4.

The WebStorm Team

Posted in Release Announcements | Tagged , | Leave a comment

WebStorm 2019.2: syntax highlighting for 20+ languages, new UI of completion popup, better support for Vue.js UI libraries, and more

⭐️WebStorm 2019.2 is now available!⭐️

WebStorm 2019.2 brings with it major enhancements in code completion for JavaScript and TypeScript, improved support for Vuetify and BootstrapVue, syntax highlighting for over 20 languages, new intentions for destructuring, and more.

DOWNLOAD WEBSTORM 2019.2

WebStorm 2019.2 is released

In this blog post we would like to share with you the detailed release notes for this WebStorm update. They are compiled from the EAP blog posts that we’ve been publishing here for the past several months.

Here are the features and improvements grouped by the WebStorm subsystems:

  • JavaScript and TypeScript support: improved presentation of completion suggestions; support for the Pipeline operator; new intentions for JavaScript destructuring; improvements for the Rename refactoring; new type hints in the editor; and improved simplify quick fix for boolean expressions.
  • Code editing: syntax highlighting and basic code completion for 20+ languages; completion for mistyped keywords and name; detection of the duplicate code; and extended support for EditorConfig for code style.
  • Style sheet support: code style for aligning SCSS and Less values; and support for PostCSS simple vars.
  • Node.js and npm: support for .nvmrc on macOS and Linux and option to download Node.js when creating a new project.
  • Development with Vue.js: Improved support for Vue.js component libraries.
  • Development with Angular: parameter hints inside method calls in templates and more.
  • Development with React: improved rename for props.
  • Debugging: updated Smart step into and hide frames from libraries
  • IDE improvements: open several projects in one IDE window; support for shell scripts; and updated plugin configuration.
  • Version Control: code completion in .gitignore files; hide author, date or hash from Log; view Git history for multiple folders; and abort Git merge and cherry-pick

Continue reading

Posted in Release Announcements | Tagged , | 29 Comments

WebStorm 2019.2 EAP #6: simplify conditions, improved support for Vue.js and EditorConfig

WebStorm 2019.2 Early Preview build #6 is now available!

If you’re unfamiliar with our Early Access Program or if you want to catch up on all the new features, check out the previous EAP blog posts.

The Toolbox App is the easiest way to get the EAP builds and keep both your stable WebStorm version and any EAP versions up to date. Or you can download the EAP builds from our website. You can also get notified right from the IDE when a new EAP build is available: go to Preferences | Appearance & Behavior | System Settings | Updates and select “Automatically check updates for Early Access Program”.

DOWNLOAD WEBSTORM 2019.2 EAP

Important! WebStorm EAP builds are not fully tested and might be unstable.

Here are some of the highlights of WebStorm 2019.2 EAP #6 (build 192.5587.21). For the full list of issues fixed in this update, see the Release Notes.

Simplify boolean expressions

To help you keep things simple, WebStorm now warns you if you have a boolean expression in your code that has any extra bits that are not actually required (e.g. condition in the if statement), and offers you a quick-fix (Alt-Enter) to simplify it without changing the logic.

Simplify condition

Continue reading

Posted in Early Access Preview | Tagged , , , | 16 Comments

WebStorm 2019.2 EAP #5: improvements for the Rename refactoring and type hints

WebStorm 2019.2 Early Preview build #5 is now available!

If you’re unfamiliar with our Early Access Program or if you want to catch up on all the new features, check out the previous EAP blog posts.

The Toolbox App is the easiest way to get the EAP builds and keep both your stable WebStorm version and any EAP versions up to date. Or you can download the EAP builds from our website. You can also get notified right from the IDE when a new EAP build is available: go to Preferences | Appearance & Behavior | System Settings | Updates and select “Automatically check updates for Early Access Program”.

DOWNLOAD WEBSTORM 2019.2 EAP

Important! WebStorm EAP builds are not fully tested and might be unstable.

Here are some of the highlights of WebStorm 2019.2 EAP #5 (build 192.5438.26). For the full list of issues fixed in this update, see the Release Notes.

Improvements for the Rename refactoring

In this update, we’ve made some changes in the way WebStorm performs the Rename refactoring in JavaScript and TypeScript. The most significant of which is, that now, the usages that the IDE treats as dynamic are not renamed by default and they are grouped together in the Refactoring preview and Find Usages tool window. Continue reading

Posted in Early Access Preview | Tagged , , | 17 Comments

WebStorm 2019.2 EAP #4: new intentions for destructuring, commit from Local Changes tab

WebStorm 2019.2 Early Preview build #4 is now available!

If you’re unfamiliar with our Early Access Program or if you want to catch up on all the new features, check out the previous EAP blog posts.

The Toolbox App is the easiest way to get the EAP builds and keep both your stable WebStorm version and any EAP versions up to date. Or you can download the EAP builds from our website. You can also get notified right from the IDE when a new EAP build is available: go to Preferences | Appearance & Behavior | System Settings | Updates and select “Automatically check updates for Early Access Program”.

DOWNLOAD WEBSTORM 2019.2 EAP

Important! WebStorm EAP builds are not fully tested and might be unstable.

Here are some of the highlights of WebStorm 2019.2 EAP #4 (build 192.5281.21). For the full list of issues fixed in this update, see the Release Notes.

Support for the Pipeline Operator

Even though the pipeline operator is still a Stage 1 proposal, we’ve decided to support its minimal version that covers the use of the |> syntax (and excludes the partial application and topic reference syntax).

pipeline-operator-min

Talking about proposals, the Object.fromEntries method has reached Stage 4 and is now available in code completion suggestions.

New intentions for the JavaScript destructuring

In WebStorm 2019.1 we added lots of intentions to help you introduce destructuring syntax to your JavaScript and TypeScript code.

Now, we’ve added two more: Propagate to destructuring and Replace destructuring with property or index access. Let’s have a closer look at them.

The Propagate to destructuring intention (Alt-Enter) will replace an extra variable if it’s possible with another destructuring. Continue reading

Posted in Early Access Preview | Tagged , , , | 4 Comments

WebStorm 2019.2 EAP #3: detect duplicate code, use Node.js version from .nvmrc

WebStorm 2019.2 Early Preview build #3 is now available!

If you’re unfamiliar with our Early Access Program or if you want to catch up on all the new features, check out the previous EAP blog posts.

The Toolbox App is the easiest way to get the EAP builds and keep both your stable WebStorm version and any EAP versions up to date. Or you can download the EAP builds from our website. You can also get notified right from the IDE when a new EAP build is available: go to Preferences | Appearance & Behavior | System Settings | Updates and select “Automatically check updates for Early Access Program”.

DOWNLOAD WEBSTORM 2019.2 EAP

Important! WebStorm EAP builds are not fully tested and might be unstable.

Here are some of the highlights of WebStorm 2019.2 EAP #3 (build 192.5118.44). For the full list of issues fixed in this update, see the Release Notes.

Searching for duplicate code

WebStorm 2019.2 adds a new inspection that allows you to find code duplicates in your project. Enabled by default, the inspection checks your code on the fly and immediately highlights potential duplicates in the editor. It works for JavaScript, TypeScript, CSS, Sass, SCSS, and Less.

Highlighted duplicate code in the editor

Select Show all duplicates like this in the inspection tooltip to see the potential duplicates and compare your code with them.

See duplicates with diff

If you want to scan the whole project for code duplicates, call up Run inspection by name using the Find Action popup (Cmd/Ctrl-Shift-A) and then select Duplicate code fragment to run the inspection.

Continue reading

Posted in Early Access Preview | Tagged , , , , | 2 Comments