How do I disable prettier from adding extra space in self closing tag HTML element? #18289

hashfiputra · 2025-11-21T01:48:30Z

hashfiputra
Nov 21, 2025

For example in my React component:

// I have this
<div className="..."/>

// Prettier will do this
<div className="..." />

I can't find anything to disable this in the docs

tt-a1i · 2025-12-16T02:52:00Z

This is intentional JSX formatting behavior and there is no Prettier option to disable it.

The space before /> in self-closing tags is part of the JSX spec recommendation and Prettier enforces it for consistency.

Why it exists:

Workarounds:

{/* prettier-ignore */}
<div className="..."/>

Accept the convention
Most React codebases use the space. It is the de facto standard.
Use a different formatter
If this is a dealbreaker, tools like Biome or dprint allow more configuration.

Unfortunately Prettier is opinionated here and does not provide a config option for this specific behavior.

0 replies