revamp ESLint and formatting integration

There are a few ongoing issues/inconveniences with ESLint. There are a bunch of posts/feature requests/bug reports with specific issues (some from me) but I think this warrants its own thread as a whole area that needs improvement, especially because the most popular free IDE does this better than Webstorm.

1. Formatting JS is a pain point

The formatting settings are spread out over "code style" in preferences, clicking "apply ESLint" in project view (after enabling it in preferences), "format with Prettier" if applicable and "set style from" (with very limited choices).

This should all be in one settings group. I would expect the "code style" settings to first have "set style from" options for an ESlint config or Prettier OR have checkboxes for "override style with ESLint" and "override style with Prettier" with an option to set priority/order. 

The "Code > Reformat Code" command should respect whatever this setting is without the need to separately run "Format with Prettier" or to click "apply ESLint." Those could be kept as manual options but should all be grouped together in the Code menu.

2. Deciphering ESLint inspections is a pain point

The inspection severity should respect the severity from the ESlint config. This is actually already present as an option but doesn't work.

3. CSS formatting can't be set by StyleLint

This should work the same as javascript; optionally set css styles from a config that overrides other settings. The "Code > Reformat Code" command should respect whatever this setting is without the need to separately run "External Tools > StyleLint"

Thanks!

3 comments
Comment actions Permalink

>I would expect the "code style" settings to first have "set style from" options for an ESlint config or Prettier OR have checkboxes for "override style with ESLint" and "override style with Prettier" with an option to set priority/order

Please vote for https://youtrack.jetbrains.com/issue/WEB-36393

 

>The "Code > Reformat Code" command should respect whatever this setting is

doesn't it? This action _only_respects current code style preferences that can be imported from ESLint, Prettier, whatever else

 

>The inspection severity should respect the severity from the ESlint config. This is actually already present as an option but doesn't work.

it uses the severity from .eslintrc by default (there is an option to override it), and this does work

 

>CSS formatting can't be set by StyleLint

Please follow https://youtrack.jetbrains.com/issue/WEB-31347 for updates

0
Comment actions Permalink

Thanks Elana,

>>The "Code > Reformat Code" command should respect whatever this setting is

> doesn't it? This action _only_respects current code style preferences that can be imported from ESLint, Prettier, whatever else

Currently (2019.3.4) this action applies Code Style settings in Preferences, which (as noted in https://youtrack.jetbrains.com/issue/WEB-36393) are not synced w ESLint, Prettier, etc.

>>The inspection severity should respect the severity from the ESlint config. This is actually already present as an option but doesn't work.

>it uses the severity from .eslintrc by default (there is an option to override it), and this does work

This has never worked for me but will download the new 2020 version and retry.

0
Comment actions Permalink

>Currently (2019.3.4) this action applies Code Style settings in Preferences, which (as noted in https://youtrack.jetbrains.com/issue/WEB-36393) are not synced w ESLint, Prettier, etc.

you can import code preferences from ESLint (https://www.jetbrains.com/help/webstorm/2020.1/eslint.html#ws_js_linters_eslint_import_code_style_from_eslint) and Prettier (https://www.jetbrains.com/help/webstorm/2020.1/prettier.html#ws_prettier_apply_code_style) though these actions are not available in Set from... dropdown

0

Please sign in to leave a comment.