prettier-vscode Trouble reading prettierrc if it uses extends

trafficstars

Summary

If you have a prettier config npm package and install it in your local repo (such as in a big team where you want to centrally manage your prettier config), then you use the extends, now when you set up the settings.json in vscode, and prettier require config to be true, it doesn't seem to work. It will only work when you copy paste the actual rules in your config file. That means the current fix is to have a post install script to manually copy that file.

Github Repository to Reproduce Issue

N/A

Steps To Reproduce:

Have a prettier config released as an independent npm package.
Install it in your local repo, add this to your .prettierrc locally

module.exports = {
    ...require('@yourOrg/prettier-config'),
  };

Add this to your .vscode/settings.json:

{
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true,
  "editor.formatOnPaste": false,
  "prettier.requireConfig": true
}

start changing and see if it works as expected.

Expected result

It should format exactly as our prettier config rules specified in that npm package.

Actual result

It doesn't seem to work, unless we copy the rules into our local prettierrc.

Additional information

N/A.

VS Code Version: 1.71.2 (Universal)

Prettier Extension Version: v9.9.0

OS and version: MacOS 12.6 as well as Ubuntu 22.04

Prettier Log Output

LOG GOES HERE. DO NOT USE A SCREENSHOT, COPY AND PASTE THE TEXT

Sep 27 '22 12:09 AnnieTaylorCHEN

I'm having the same issue described above. We have a shared prettier configuration that is imported via an NPM module, and then referenced from the project's .prettierrc file. When the reference is there, changes to the module's .prettierrc do not change how the document is formatted. It would seem that when you refer one prettier config file from another, the extension does not follow. Very simple to reproduce:

Create a .prettierrc file with the following:

"./.prettierrc-test.json"

Create a prettierrc-test.json file with a Prettier configuration. In my test, I simply turned semicolons on and off:

{ "semi": false }

When you change semi to true/false and use the command line to format your project files, you will see that they follow whatever is in prettierrc-test.json as it is correctly resolving the reference in .prettierrc.

However, When simply using the Prettier extension to format your files, the configurations in prettierrc-test.json are not followed at all.

Apr 06 '23 18:04 jguerinet

I can also confirm that I have the same problem. If necessary, I will set up an example project that uses a npm prettier config package.