In addition to the completion for the components that was available before, you can now also enjoy completion and navigation for the Material attributes.īetter HiDPI support on multiple displaysĮarlier, on Windows and Linux WebStorm would scale the UI according to one global setting – the primary display. WebStorm improves support for Angular Material. The configuration for variable declaration alignment is now placed under Wrapping and Braces and configuration for comments is under Generated Code. We’ve also reorganized the settings a bit, removing the Other tab.
These options are available under Spaces. You can also configure whether to add spaces around * in ES6 generators and.
These options are available in Preferences | Editor | Code Style | JavaScript or TypeScript – Blank lines. Now you can configure to have (or not have) extra empty lines after imports, classes, fields or methods. We’ve added lots of new code style options for JavaScript and TypeScript. New code style options for JavaScript and TypeScript Press Alt-Shift-Cmd-L on macOS or Ctrl+Alt+Shift+L on Windows and Linux to open the Reformat Code dialog and then check Rearrange Code. You can then run the Rearrange Code action via the Find Action popup ( Cmd-Shift-A on macOS or Ctrl+Shift+A on Windows and Linux).Īnother option is to run it as part of Reformat Code. The configuration is available via Preferences | Editor | Code Style | JavaScript or TypeScript – Arrangements. In addition, you can configure whether fields and methods should be ordered by name. With it you can configure how different blocks of code such as the constructor, fields and methods are ordered in your JavaScript and TypeScript classes. To help you make the code more readable and consistent, WebStorm adds a new feature called Code rearrangement. We have fixed that and now WebStorm properly detects such components, provides code completion for them, and adds imports automatically.Ĭode rearrangement for JavaScript and TypeScript However, there was a known limitation – it didn’t work with React stateless components. In WebStorm 2017.1 we’ve added auto import for React components. Completion and auto import for React stateless components Please note that auto imports don’t work for symbols from the project’s dependencies, but in many cases you can add an import with a quick-fix (press Alt-Enter and select Insert import). In JavaScript, imports are now added automatically when you autocomplete a symbol that is exported in another project file. You can modify this blacklist, enable hints for all parameters or disable them completely in Preferences | Editor | General | Appearance – Show parameter name hints. To make hints not too distracting, by default they are shown only for parameters that are strings, numbers, objects or boolean values and are not shown for some frequently used methods, like filter or map or for some parameter names, like start. They show the names of parameters of a function or method and make the code easier to read. You will now see parameter hints in TypeScript code. Better HiDPI support on multiple displays.New code style options for JavaScript and TypeScript.Code rearrangement for JavaScript and TypeScript.Completion and auto import for React stateless components.
To be notified when the new EAP is available, switch to the EAP updates channel in the IDE ( Preferences | Appearance & Behavior | System Settings | Updates) or install our Toolbox App. Important: WebStorm EAP builds are not fully tested and may be unstable. Please don’t forget to mention the build number you’re using. We welcome your feedback in our issue tracker, /issues/WEB.You can install a EAP build side-by-side with a stable WebStorm version.