tl;dr: Pin the prettier
version you use for each project.
I recently discovered that running prettier
from the command line
was applying different formatting rules than when run from VS Code on save.
After ruling out a few possible causes:
.prettierrc
is setting the same things as VS Code settings- I don’t have any other formatters configured in VS Code
… I found the problem was that I was actually running two different versions.
I hadn’t installed prettier
as a project dependency,
so when I ran it from the a package.json
script like
bun x --bun prettier --write "src/**/*.{ts,js,json,css,html}"
,
I was getting whatever bun pulled down (probably the latest),
while the VS Code extension bundles its own version.
Once I saved it as a dev dependency with a pinned version number
(bun add -ED prettier
or npm install -D --save-exact prettier
),
the extension and the script used the same version,
which apply the same rules.
The VS Code extension helpfully describes how it selects which one to use:
This extension will use prettier from your project’s local dependencies (recommended). When the prettier.resolveGlobalModules is set to true the extension can also attempt to resolve global modules. Should prettier not be installed locally with your project’s dependencies or globally on the machine, the version of prettier that is bundled with the extension will be used.
Which, btw, each prettier
release changes the formatting rules.
Release notes are posed on the prettier blog.
I don’t care at all about the specifics of the rules —
that’s why prettier
works for me in the first place —
but I do want to pin the version so I have consistent formatting until I upgrade intentionally.
(This annoyed me on a low level until I started experimenting with Copilot agent mode opening PRs,
when it became more disruptive.
Agents can’t pick up precise formatting rules from your codebase by osmosis in any case,
but when working with agents like Claude Code locally
I tend to at least lightly edit their output before committing,
and when doing so VS Code’s format-on-save kicks in and prettier
runs then.
But when the agent is opening a PR, my editor usually won’t see it until it’s merged to master,
which leads to incorrect formatting sticking around until the next time I edit the file locally,
at which point the whole thing gets reformatted.)