Prettier vscode extension ignoring config files

Question

I can't get the prettier extension to use my config files. It keeps using the global settings (as defined in the config path setting in vscode). I made an example project:

https://github.com/Supperhero1/prettierTest

I set tabWidth to 1 in the .prettierrc file. When I run "npx prettier --write ." the prettier package properly formats the test.ts document to have an indentation of one, but if i save the file (I have format on save turned on) it gets formatted back to the global setting (4 spaces). I deleted all settings in the global setting but then it defaults to a tab with of two spaces. The extension seems to ignore the config file completely. A collegue has the extension and it works fine with config files.

I'm trying to figure out what could be overriding the setting, the exension description says the precedence for figuring out settings is:

Prettier configuration file
.editorconfig
Visual Studio Code Settings (Ignored if any other configuration is present)

And in the official docs, the config file resolution precedence is:

A "prettier" key in your package.json file.
A .prettierrc file written in JSON or YAML.
...

Seeing how I don't have a prettier key in my package.json file, there should be nothing that can override my .prettierrc file. I tried restarting vscode but that didn't help. Has anyone else had this issue, I'm not sure where to look to solve this problem...

Answer 1

In VS Code press Ctrl + shift + p to open command palette then chose

Preferences: Open Settings(JSON) and add the line among other settings you have:

  "prettier.configPath": ""

Save the file. Now the Prettier extension respect your local .prettierrc config files. Basically Prettier: Config Path Path to the prettier configuration file option overrides all other config files regardless of placement.