# My Prettier Settings

**Date:** 2022-10-24  
**Author:** Kees C. Bakker  
**Categories:** CSS, JavaScript, Tips, TypeScript  
**Original:** https://keestalkstech.com/my-prettier-settings/

![My Prettier Settings](https://keestalkstech.com/wp-content/uploads/2022/10/raphael-lovaski-pxax5WuM7eY-unsplash.jpg)

---

I always use Prettier to [reformat my code in Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode). Prettier formats CSS, HTML, JavaScript and TypeScript. Formatting helps code to look consistent and thereby more easily to read. In this blog I try to format all code I publish.

Most of my projects contain the following `.prettierrc` file in their root:

```js
{
  "semi": false,
  "useTabs": false,
  "tabWidth": 2,
  "arrowParens": "avoid",
  "endOfLine": "lf",
  "printWidth": 120,
  "trailingComma": "none"
}
```

Let's dive into the ***why!?***

## To semicolon or not to semicolon

Did you know JavaScript and TypeScript do not need a semicolon? [JavaScript will automatically add them for you when the code is processed](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#automatic_semicolon_insertion). I've started to omit them to make the code easier to read on my blogs (less is more).

I'm originally a C# developer, so typing a `;` comes naturally to me. I'll let Prettier remove them, to keep my code consistent.

## Tabs or spaces?

I'm a big tab fan, but for my blogs spaces just look better: sorry.

## ArrowParens!?

I'm not a native English speaker, so I had to google its meaning. It helps to remove the parens `)(` from the [fat arrows](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions):

```ts
let array = [1, 2, 3]

let before = array.map((x) => x * 2)

// "arrowParens": "avoid"
let after = array.map(x => x * 2)
```

## Ignore directories

We can ignore files / directories by adding a `.prettierignore` to your project:

```
# Shared documentation
docs/shared/
```

## Conclusion

I would like my blogs to contain code that's clear and consistant. Any settings that can help to reduce overhead will end up in my file (except for `endOfLine` 😉).

## Changelog

- 2025-02-09 Added an [ignore section](#ignore-directories).
- 2024-10-07 Rephrased some of the text.
- 2022-10-25 Added `"trailingComma": "none"` setting.
- 2022-10-24 Initial article.
