Install Code Formatter “Prettier” on VSCode
What is “Prettier"
Prettier is a code formatter and can work on Visual Studio Code as an extension.
By using this tool, your code is automatically formatted when you save it.
![](https://tech.thiscalifornianlife.com/wp-content/uploads/2020/10/61005525-E94F-4944-9FA9-017745875E44.gif)
How to install Prettier on VSCode.
You can install it on [File] > [Preferences] > [Extensions].
![](https://tech.thiscalifornianlife.com/wp-content/uploads/2020/10/Snag_1184f18.png)
Search “Prettier". Then install it.
![](https://tech.thiscalifornianlife.com/wp-content/uploads/2020/10/install_11b3f2b.png)
Configuration of the .prettierrc file.
Create a .prettierrc under your project directory and edit it.
![](https://tech.thiscalifornianlife.com/wp-content/uploads/2020/10/Settings_11f83f1.png)
Example of “.prettierrc" file.
{
"printWidth": 100,
"semi": true,
"singleQuote": true,
"tabWidth": 2
}
If Your Prettier Doesn’t Work…
Please check Default Formatter setting.
![](https://tech.thiscalifornianlife.com/wp-content/uploads/2020/10/Snag_bdbf189.png)
Discussion
New Comments
No comments yet. Be the first one!