Prettier VSCode - How to ignore formatting code for a single declaration in css, set in a global statement and not through simple comment

Question

Correct format for a single declaration and what i prefer happen

    .lbl-vlt {background-color: var(--violet);}
    .lbl-emrld {background-color: var(--emerald);}
    .lbl-orng {background-color: var(--orange);}
    .lbl-pnk {background-color: var(--pink);}
    .lbl-grn {background-color: var(--green);}

Prettier format for a single declaration not so good

    .lbl-vlt {
      background-color: var(--violet);
    }
    .lbl-emrld {
      background-color: var(--emerald);
    }
    .lbl-orng {
      background-color: var(--orange);
    }
   .lbl-pnk {
     background-color: var(--pink);
   }

Answer 1

For CSS, you can use /* prettier-ignore */ tag in your CSS file just above the definition you want Prettier to ignore.

/* prettier-ignore */
.lbl-vlt {background-color: var(--violet);}
.lbl-emrld {background-color: var(--emerald);}
.lbl-orng {background-color: var(--orange);}
.lbl-pnk {background-color: var(--pink);}
.lbl-grn {background-color: var(--green);}

Alternatively, you could add a .prettierignore file to your project root folder (this is what I have in my VS Code).