prettier-plugin-svelte: Formatting doesn't work (with newly released Prettier v2.1.0)

With Prettier v2.1.0, VSCode stops formatting .svelte files and the Svelte VSCode extension runs into Error: unknown node type: undefined pointing to prettier-plugin-svelte in the stacktrace as culprit.

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 4
  • Comments: 20 (3 by maintainers)

Commits related to this issue

Most upvoted comments

@michaelwooley cool

Edited : Seems still not working for me (no formatter found etc)

My settings :

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

What is your configuration @michaelwooley ?

My configuration that works currently :

{
  "files.associations": {"*.svelte": "html" },
  "[svelte]": {
    "editor.formatOnSave": true,
    "editor.defaultFormatter": "svelte.svelte-vscode"
  }
}

But I think format on save not working

I was having this same issue and found if I removed the .prettierrc file, then it started working as normal.

Edit: I commented out “plugins”: [“prettier-plugin-svelte”] from the .prettierrc file and saved and the formatting seems to work with just that. Hope this helps!

How to get this working again

  1. If you use the VSCode extension, make sure you have version 101.11.0 or higher installed
  2. Delete your node_modules where your npm/yarn installs live
  3. Update your package.json: If you have svelte-check / prettier-plugin-svelte / svelte-language-server in there, set them to the latest version. If you don’t have them in there, you don’t have to install them
  4. reinstall (npm i / yarn install)

More indepth

We deployed an update of the VSCode extension which contains the v1.1.1 of prettier-plugin-svelte. It leaves Prettier at 2.0.5 to wait for some more bug fixes, but if you have a different Prettier version in your workspace then that one is used instead.

To get formatting again, you also have to update your prettier-plugin-svelte version in your workspace, which you have installed if you installed svelte-check. Simply update svelte-check for that. If you did not install svelte-check or prettier-plugin-svelte directly, you can skip this.

Reason why you need to do this: Prettier will load prettier-plugin-svelte from both your workspace and our VSCode extension, but for some reason does use the workspace version for parsing and the extension version for formatting, which will break.

For context, this gist contains my:

  1. full error from VS Code svelte output
  2. System info
  3. VS Code extensions