Format document not running prettier?

[lorensr]

What's the best way to diagnose this issue? I have prettier installed and enabled. It used to work fine. I don't know when exactly it stopped working. When I have for instance this:

  <p>test</p>
<Modal     open={this.state.addingReview}        ></Modal>

And run Format Document, it results in this:

<p>test</p>
<Modal open={this.state.addingReview}      ></Modal>

Whereas running prettier from the command line results in:

<p>test</p>
<Modal open={this.state.addingReview} />

[ajhyndman]

Seems to me like the most recent version of VS Code has lost compatibility with this extension.

[RobinMalfait]

@ajhyndman I'm on the latest vscode version and the extensions still works for me.

@lorensr Do you see any errors in the prettier output window? (press the right bottom prettier item)

[CiGit]

Do you have multiple formatter installed? eslintIntegration?

You could try disabling prettier and see if format does the same. If so, search for the extension formatting like this.

[ajhyndman]

Whoah, that's weird... Thanks for the suggestion, @CiGit . I disabled the ESLint extension, and re-enabled it. Now prettier seems to be running again?

It's possible I changed something else without realizing, as well. I'll report back if any issues resurface.

[lorensr]

Disabling eslint and reloading has no effect. @RobinMalfait do you mean this output tab? It's not an option.

Prettier is def enabled:

Here are other extensions:

[Bassetts]

Prettier appears to have stopped working for me on version 1.22.0-insider. I don't have ESLint installed so this is definitely not causing the issue.

[CiGit]

@lorensr Seems the extension did not start. Can you take a look at dev console? Help -> toggle developer tools -> console

Try reinstalling:

• Uninstall extension
• Close VSCode
• Be sure $HOME/.vscode{,-insider}/extensions/esbenp.prettier-vscode-1.2.2 doesn't exist
• Install extension

[sstimac]

What happened in my case, is VSC update deleted some of my user settings, one of which was the formatOnSave , which is why the extension seemed broken ( as i'm used to format on save ).

Setting the property back was easy enough. If that's the case, check if you have "editor.formatOnSave": true set within the settings.

[lorensr]

My settings were intact. Here was the error:

Activating extensionesbenp.prettier-vscodefailed: Cannot find module 'resolve'.

Fixed by reinstalling. Did have to manually delete the folder. Thank you CiGit!

[umlx5h]

I have a same problem. It used to work. I tried to solve problem by @CiGit and @sstimac workaround. But It couldn't be solved. This problem was already solved? I use a latest version vscode(1.21.1) and this extension(1.2.2).

[CiGit]

If you have a missing dependency, reinstalling is the only thing I see.

[danawoodman]

For future idiots like me, make sure the file you're saving isn't in your .prettierignore file! 🤦‍♂️

[amypellegrini]

I run into this problem and in my particular case the "solution" required to address flow errors first, as prettier won't run if there are flow errors.

[guiccbr]

I had an error on my code that was preventing prettier to run. Was able to see the error through the output panel and selecting prettier on the dropdown on the right, as suggested by @RobinMalfait.

[skube]

For me, I don't see any errors/output from Prettier on the dropdown in the OUTPUT panel.

I'm noticing if I remove the plugin:prettier/recommended from .eslintrc:

"extends": ["airbnb","plugin:prettier/recommended"]

It works again (but obviously under different rules) so I dunno

[peterbe]

My problem was that I had prettier in my frontend/package.json but nothing in frontend/node_modules. The reason it's like that is because node_modules is installed inside a docker container.

My executable prettier is /Users/peterbe/.config/yarn/global/node_modules/.bin/prettier but for some reason, in this project, it couldn't use that.

[xerosanyam]

I had a keyword delete, because of which prettier was showing output but not formatting the code

[Norfeldt]

My problem was that I had prettier in my frontend/package.json but nothing in frontend/node_modules. The reason it's like that is because node_modules is installed inside a docker container.

My executable prettier is /Users/peterbe/.config/yarn/global/node_modules/.bin/prettier but for some reason, in this project, it couldn't use that.

Thank you! You pointed me to look into the package.json to find some prettier stuff that needed to be removed.

[simonhaenisch]

Just updated to 1.33.0 and suddenly had the same problem of it not working on save... the way I got it fixed was that I ran "Format Document" through the command palette. Then VS Code showed a notification that there are multiple formatters for .ts files installed and asked me to set a default, which added

"[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
}

to my settings. Maybe that's a feature of the new version but sadly it doesn't show the notification when trying to run the formatter by saving the file, but the default formatter thing seems to be a nice feature.

[everton-e26]

thanks @simonhaenisch

I did not know how to change this file, so I am sharing this link that can be useful for anyone who has the same problem.

https://code.visualstudio.com/docs/getstarted/settings#_language-specific-editor-settings

[verlok]

I was getting the error "Prettier cannot format code". Uninstalling and reinstalling Prettier worked for me too.

[jessepinho]

For those of you using TypeScript, perhaps this is your issue: I noticed this in my VSCode settings.json:

  "[typescript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },

This was blocking Prettier from running on my .ts and .tsx files. Removing these fixed the issue for me.

[klippx]

For me this was broken in 1.34.0 and I tracked it down to config.json:

"prettier.eslintIntegration": true,

When I removed this everything worked again.

[rohitkrishna094]

For anyone who reached here, you might as well try this dumb solution(which happened to work for me).

Just click on prettier button in the bottom right of your vscode application. 😅

[acnevyts]

My problem was my editor.formatOnSaveTimeout config somehow got changed to 0. Found this out by checking in the 'Log (Window) Output' tab.

[2019-06-06 16:06:39.432] [renderer1] [warning] Aborted format on save after 0ms

increased it to 1000 and now its working fine.

[rsanath]

In my case, I had this in my settings "prettier.requireConfig": true which when I removed started working.

[JulianSoto]

Make sure Git is up to date

[xrafaelcruz]

For me this was broken in 1.34.0 and I tracked it down to config.json:

"prettier.eslintIntegration": true,

When I removed this everything worked again.

Work for me, thanks :D

[1729patrick]

@ramsanath thanks, work for me

"prettier.requireConfig": true

[deloitte-erstevens]

@acnevyts thank you, this was my issue.

[d-e-v-esh]

I was having the same problem all of a sudden. I checked the box called "indent lines with tabs" under "prettier" in settings and checked another box called "format on save" under "editors" and that worked for me. I am a beginner so I do not have much idea about any of this still and I just messed around the settings.

[klippx]

Yep, issue reappeared suddenly so it's good that I am still subscribed to this thread, checking "indent lines with tabs" seems to fix it this time over 😅 👍

[eminx]

For me the fix was simply going to the global settings at VS Code, and checking the field at:

Preferences >> Settings >> Text Editor >> Formatting >> Format on Save (check this!)

[metkerr]

What happened in my case, is VSC update deleted some of my user settings, one of which was the formatOnSave , which is why the extension seemed broken ( as i'm used to format on save ).

Setting the property back was easy enough. If that's the case, check if you have "editor.formatOnSave": true set within the settings.

this work for me, thanks

[diorcula]

For me the fix was simply going to the global settings at VS Code, and checking the field at:

Preferences >> Settings >> Text Editor >> Formatting >> Format on Save (check this!)

This worked for me, although i am not entirely sure if it uses prettier or standard formatting from [shift] + [alt] + [f]

[github-actions[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.