prettier is not picking up .svelte files without specifying them explicitly

Question

I've created a svelte project and wanted to use prettier. I have prettier svelte plugin.

pnpm exec prettier --write .

will only pick up js and html files.

pnpm exec prettier --write .src/routes/+page.svelte

or

pnpm exec prettier --write . **.svelte 

will work correctly and pick up all the files.

isn't the expected behavior or prettier to pick up svelte files too? Why doesn't it pick them up?

Balls

You may need to install the Svelte Prettier plug-in of you haven't already. github.com/sveltejs/prettier-plugin-svelte – Orangery

Answer 1

This was a bug in Prettier, I've had this on Prettier version 3.0.0.

The workaround is to explicitly provide the --plugin option like this:

pnpm exec prettier --plugin 'prettier-plugin-svelte' --write .

Or simply upgrade your Prettier to latest version. I can confirm 3.2.5 works correctly.

Cutanddried

Answer 2

I was able to get prettier to format my vscode by going to the .vscode folder at project root (create one if you dont have it) and adding a settings.json file with:

{
    "[svelte]": {
        "editor.defaultFormatter": "svelte.svelte-vscode"
    }
}

I discovered this while looking at the docs for this plugin which I installed.

Enow

Issue is not related to vscode configuration at all. Only CLI tools and and npm scripts. I am experiencing the same issue using vim as a code editor. – Wolfy