Before I state any of my problems this is my .prettierrc file so far

{
    "semi": true,
    "useTabs": true,
    "tabWidth": 4
}

Problem 1: I would like my prettier to not seperate my HTML attributes onto new lines. Examples below.

<input
    type="radio"
    name="radiogroup1"
    id="rd2"
/>

Should be this

<input type="radio" name="radiogroup1" id="rd2" />

Another example.

<i
    aria-hidden="true"
    class="fa fa-user"
>

Should be this

<i aria-hidden="true" class="fa fa-user">

Problem 2: I would like my prettier to not seperate my HTML opening angle bracket and closing angle bracket. Examples below.

<span
>

Should be this

<span>

Another example.

<label for="cb1"
>I agree with terms and conditions</label
>

Should be this

<label for="cb1">I agree with terms and conditions</label>

I tried asking GPT and searching on the internet to no avail. Either I missed some keywords or didnt prompt correctly.

1

There are 1 best solutions below

0
mufsalup On

According to some other stack overflows you could try to use printWidth to avoid having to long lines of code (that would result in a breaking of the line). I add you a link to that page below: Is there a config in prettier to keep line breaks?

You could also try bracketSameLine, I post you a link below: https://prettier.io/docs/en/options.html#bracket-line CAVE: This is deprecated as of 4.2.0. Replaced with bracketSameLine