Prettier removes Promise<void> type and other annotations in TypeScript arrow functions
Summary
Prettier removes Promise
Steps To Reproduce:
- Create a new TypeScript file with an interface containing Promise
return types - Configure Prettier with "arrowParens": "always"
- Save the file and observe Prettier's formatting
- Note that TypeScript shows an error: "Generic type 'Promise<T>' requires 1 type argument(s)"
Expected result
Prettier should preserve the Promise
Example:
interface Example {
myFunction: (param: string) => Promise<void>;
}
Actual result
Prettier removes the
interface Example {
myFunction: (param: string) => Promise;
}
This causes TypeScript to error with "Generic type 'Promise<T>' requires 1 type argument(s)".
Additional information
The only current workarounds are // @ts-ignore or // prettier-ignore
Neither solution is ideal for maintaining clean, type-safe code.
VS Code Version: 1.95.3
Prettier Extension Version: 11.0.0
OS and version: Ubuntu 24.04
Prettier Log Output
[INFO] Prettier Options:
{
"plugins": ["@trivago/prettier-plugin-sort-imports"],
"importOrder": [...],
"importOrderSeparation": true,
"importOrderSortSpecifiers": true,
"printWidth": 120,
"arrowParens": "always"
}
[INFO] Prettier Resolution: Prettier Path: /Users/[username]/project/node_modules/prettier
[INFO] Formatting file:///Users/[username]/project/src/types.ts
[INFO] Formatting completed in 0.1s
Same issue here. Temporary workaround is to remove the plugins. No matter what plugins I think, cause I had "@trivago/prettier-plugin-sort-imports", "prettier-plugin-tailwindcss", The error occurred no matter which I disabled, as long as one is active.
I also have noticed this. I have a repo with a reproduction here: https://github.com/ianmitchell/tailwind-example
If you open the repro and navigate to the page.tsx file and save, the extension will change the Promise<number> function return signature to Promise. This doesn't happen when prettier is invoked via the CLI.
If I can do anything else to help debug this, happy to help!
+1 here
+1 here
I meet in the same issue after packages.json libraries update. Restarting Prettier VScode extension worked for me.
I had to remove this line of my vscode settings.json
"prettier.prettierPath": "/usr/local/lib/node_modules/prettier/index.cjs",
Now it works again.
+1 here
Only way to fix was to remove this plugin:
"plugins": ["@trivago/prettier-plugin-sort-imports"],
which we'd love to keep using...
+1 here
Only way to fix was to remove this plugin:
"plugins": ["@trivago/prettier-plugin-sort-imports"],which we'd love to keep using...
Exact same situation here. Just added the plugin to a new repo and observed the behavior
+1 here Only way to fix was to remove this plugin:
"plugins": ["@trivago/prettier-plugin-sort-imports"],which we'd love to keep using...
Exact same situation here. Just added the plugin to a new repo and observed the behavior
Reinstalling the VSCode Prettier extentions appears to have solved this for me
For me Prettier 3.3.2 or lower does not exhibit this behavior. I narrowed it down to 3.3.3+ that does, which makes me wonder what changed in 3.3.3 that could have broken compatibility when using plugins and generics at the same time.
Uninstalling and reinstalling the extension did not help, but disabling plugins also prevents the generics from being removed, so long as 0 plugins are configured.
Related discussion on SO here
I don't have this issue in vscode, but only in the CLI. But same for me, removing the only plugin I had (prettier-plugin-tailwindcss) was solving the issue in the cli. For information though, weirdly I was used to use pnpm instead of npm and had no issue with pnpm. Not sure why it has to be different but maybe it helps.
Update: I went back to prettier 3.4.2 and it solved the issue. Then I installed 3.5.0 again and it works. Looks like a npm install issue?
FWIW, I ran into this same issue after I updated my project typescript dependency from v4.9 to v5.7 and found my way here. The recommendation from @pawel-halat worked for me. I restarted my extensions and the problem went away. I was just about to give up and disable with a prettier-ignore comment.
@cedeber , it might have worked for you because you effectively restarted the extension by switching versions.
FWIW, prettier-plugin-sort-imports seems to have this problem. I switched to prettier-plugin-organize-imports and it works fine.
I'm having the same problem with prettier-plugin-organize-imports. Disabling the plugin solves it.
There was no prettier in my package.json and I had the same problem. A simple pnpm add -D prettier fixed it for me (it installed version 3.5.1).
@nonpop 😄 Actually, for me, it was the exact opposite. I had the prettier package included in my package.json and after upgrading a bunch of packages (including prettier) it started to strip my Promise types. I didn't notice it at first as my default setting is to format on save, but when I touched a file with Promise<void> set as the return type of a function it started to throw compilation errors. I just removed prettier from package.json as direct dependency and everything went back to normal.
My project uses shared prettier configuration from npm package, and prettier property is set in package.json so VSCode extension properly picks it up and uses with built-in prettier extension version.
I tried to fix it for 6 hours, edited the prettier.config.js, didn't sleep until 4am... Just had to restart vscode ಥ‿ಥ all for this >>> "plugins": ["@trivago/prettier-plugin-sort-imports"]
Upgrade prettier from 3.4.2 to 3.5.2 solved my problem. I use prettier-plugin-organize-imports as well. I use visual studio 2022 and typescript Analyzer(ESlint). Copy new installed prettier to C:\Users\xx\AppData\Local\Microsoft\VisualStudio\17.0_aa37ebb0\Extensions\nwyzzcs5.qrm\Node\node_modules.
I can also confirm that upgrading beyond 3.3.2 is now possible, I went straight to 3.5.3 without any issues. Curious which release fixed it, but not going to spend the time to find out.
There was no prettier in my package.json and I had the same problem. A simple
pnpm add -D prettierfixed it for me (it installed version 3.5.1).
it worked for me, i updated the prettier version in my global dependencies with npm i -g prettier@latest and restarted VSCode
I must answer here, same problem. My solution is: Format Document With change Configure Default Formatter from Prettier-Code Format to Prettier Eslint, and the problem solved. I don't know why, but at least, the problem solved
for me, reinstall prettier solve the problem
I meet in the same issue after packages.json libraries update. Restarting Prettier VScode extension worked for me.
It helped me. Thank you!
There was no prettier in my package.json and I had the same problem. A simple
pnpm add -D prettierfixed it for me (it installed version 3.5.1).
thanks!
This seems to be flaky. It happened to me today. Then I
- commented out plugins in prettierrc,
- saved a file in vs code to run prettier and formatting worked,
- uncommented the plugins to re-enable them,
- made and change and saved again to run prettier again
The problem was gone after re-enabling plugins. It was randomly converting Promise<foo> into Promise, and changing and restoring my prettierrc somehow fixed it in VS Code.
adding parser: 'babel-ts to my prettier config solves this for me (prettier v3.6.2)
https://github.com/tailwindlabs/prettier-plugin-tailwindcss/issues/338#issuecomment-2574259286
source: https://github.com/tailwindlabs/prettier-plugin-tailwindcss/issues/338