Prettier in VS code does not format some of the files

by

Summary

A subset of .ts files in VS Code failed to format with Prettier despite the extension being installed and configured. Prettier reported “Formatting completed,” but no changes were applied. The root cause was the presence of requirePragma: true in the Prettier configuration, which instructs Prettier to only format files that contain a pragma comment (e.g., /** @format */). Files without this pragma are silently skipped.

Root Cause

The issue was caused by a local Prettier configuration overriding VS Code settings and specifically enabling:

  • requirePragma: true — Prettier formats only files containing a pragma comment.
  • Files without the pragma are ignored, even though VS Code still shows “Formatting completed.”
  • The working files that did format happened to contain the pragma or were otherwise exempt.

Why This Happens in Real Systems

This class of problem appears frequently because:

  • Local project configs override editor configs, often without developers realizing it.
  • Prettier’s behavior is silent by design when skipping files due to pragma requirements.
  • Teams sometimes copy .prettierrc files without understanding all options.
  • VS Code’s “Formatting completed” message does not indicate whether Prettier actually changed anything.

Real-World Impact

Misconfigured Prettier settings can lead to:

  • Inconsistent formatting across a codebase.
  • Wasted debugging time because the formatter appears to run but does nothing.
  • Code review friction when formatting differs between developers.
  • False assumptions that VS Code or Prettier is broken.

Example or Code (if necessary and relevant)

Below is an example of a Prettier config that will prevent formatting unless the file contains a pragma:

{
  "requirePragma": true
}

To allow formatting on all files, remove or disable the setting:

{
  "requirePragma": false
}

How Senior Engineers Fix It

Experienced engineers typically:

  • Inspect the effective Prettier configuration (local > workspace > global).
  • Remove or override requirePragma unless the team explicitly uses pragma-based formatting.
  • Validate by running Prettier from the CLI to confirm behavior.
  • Add a shared Prettier config to the repository to avoid editor-specific drift.
  • Document formatting expectations in the project’s README.

Why Juniors Miss It

Less experienced developers often overlook this because:

  • They assume VS Code settings take precedence, not realizing local config wins.
  • They don’t know that Prettier can silently skip files.
  • They focus on the editor rather than the underlying tool behavior.
  • They rarely inspect the Prettier output logs or the project’s .prettierrc.

Key takeaway: When Prettier formats some files but not others, always check for pragma requirements and local configuration overrides.

Leave a Comment