0

I'm in a team working on Angular projects and using Prettier for code formatting (HTML, TypeScript, SCSS). We're encountering merge conflicts due to inconsistent Prettier formatting across team members' machines. Even though everyone has the Prettier extension installed, the formatting for some HTML code snippets differs. Here's an example: Of using prettier code formatting on my laptop -

<img *ngIf="q" class="w-full h-full" src="as.svg" />  // My formatting

On a teammate's laptop, the same code formatter with prettier looks like this:

<img 
*ngIf="q"
class="w-full h-full" 
src="as.svg" />

This inconsistency leads to merge conflicts and wasted time resolving them. We want to ensure:

  1. Uniform Prettier Formatting: How can we configure Prettier to enforce consistent formatting rules for HTML files across all team members' IDEs (VS Code and WebStorm)?

  2. Selective Formatting: Ideally, Prettier should only format newly added lines of code, not reformat the entire file when we save changes.

If anybody has any other plugin suggestions which will do the same job as prettier we are sorted.

1

0