jsxBracketSameLine - Prettier how to configure

bracketSameLine is the new version of jsxBracketSameLine

Andres Canavesi
Oct 29, 2021
Pro tip: instead of running by hand, you can integrate it with you favorite IDE
featured image

How to install Prettier

npm install prettier --save-dev

How to configure Prettier

touch .prettierrc.json
Add some default configuration:
	"trailingComma": "es5",
	"tabWidth": 4,
	"printWidth": 120,
	"semi": true,
	"singleQuote": false,
	"useTabs": false,
	"quoteProps": "as-needed",
	"jsxSingleQuote": false,
	"bracketSpacing": false,
	"bracketSameLine": true,
	"arrowParens": "avoid",
	"requirePragma": false,
	"insertPragma": false,
	"proseWrap": "preserve",
	"endOfLine": "lf"

How to ignore folders in Prettier

touch .prettierignore
Add some folders to be ignored. Tipically it will be pretty similar to your .gitignore file
# Ignore artifacts:


How to start detecting issues with Prettier

 prettier . -c
Photo by Greg Rosenke on Unsplash