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

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);
   }
cssvisual-studio-codeformattingprettier


Solution 1:[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).

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 zevij

Related Questions