How to setup prettier for WebStorm ?

Prettier is amazing code formatter and help a lot don´t be worried about your own style or just run a set of formatter rules, it works like a charm on vscode but for webstorm need some extra clicks.

1- Be sure you have prettier in your project or install it globally.

npm install -g prettier

2- Go to File | Settings | Languages & Frameworks | JavaScript | Prettier
and check options.

[:white_check_mark:] On code reformat.
:white_check_mark:] On save.

Sass and SCSS

Thanks @dinaelurdaneta we can use prettier with sass or scss files using stylelint and extra setup for prettier.

1- Install stylelint local or globally.

npm install -g stylelint

2- Add scss and sass extension into Run for file glob pattern.

If you use Vue framework, add vue extensions and prettier will take care about them.

include sass extension for prettier support

Enjoy Prettier!