Custom Plugins in Prettier Config Breaks Prettier Extension

Summary

Providing plugins field in .prettierrc breaks the extension. When a prettier plugin exists in the .prettierrc file, the extension cannot resolve the module for the plugin. Meanwhile using terminal to format files (e.g: npm run prettier --write "src/**/*.{ts,tsx,js,jsx,json}") works.

Github Repository to Reproduce Issue

https://github.com/alicanerdogan/prettierrc_bug

Steps To Reproduce:

1. Create a repo with the following .prettierrc

{
  "tabWidth": 2,
  "useTabs": false,
  "semi": false,
  "singleQuote": true,
  "trailingComma": "none",
  "arrowParens": "avoid",
  "plugins": [
    "prettier-plugin-organize-imports"
  ]
}

1. Add prettier-plugin-organize-imports as a custom plugin
2. Format a ts file using the VSCode prettier extension

Expected result

File(s) should be formatted.

Actual result

Files are not formatted.

Additional information

VS Code Version: 1.61.2

Prettier Extension Version: 9.0.0

OS and version: MacOS BigSur 11.6

Prettier Log Output

["INFO" - 2:48:24 PM] Formatting /Users/johndoe/repos/test_app/src/index.ts
["INFO" - 2:48:24 PM] Using config file at '/Users/johndoe/repos/test_app/.prettierrc'
["INFO" - 2:48:24 PM] Using ignore file (if present) at /Users/johndoe/repos/test_app/.prettierignore
["INFO" - 2:48:24 PM] File Info:
{
  "ignored": false,
  "inferredParser": "typescript"
}
["INFO" - 2:48:24 PM] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 2:48:24 PM] Prettier Options:
{
  "filepath": "/Users/johndoe/repos/test_app/src/index.ts",
  "parser": "typescript",
  "tabWidth": 2,
  "useTabs": false,
  "semi": false,
  "singleQuote": true,
  "trailingComma": "none",
  "arrowParens": "avoid",
  "plugins": ["prettier-plugin-organize-imports"]
}
["ERROR" - 2:48:24 PM] Error formatting document.
["ERROR" - 2:48:24 PM] Cannot find module 'prettier-plugin-organize-imports'
Require stack:
- /Users/johndoe/repos/test_app/node_modules/prettier/index.js
- /Users/johndoe/.vscode/extensions/esbenp.prettier-vscode-8.2.0/dist/extension.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-amd.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-fork.js
Error: Cannot find module 'prettier-plugin-organize-imports'
Require stack:
- /Users/johndoe/repos/test_app/node_modules/prettier/index.js
- /Users/johndoe/.vscode/extensions/esbenp.prettier-vscode-8.2.0/dist/extension.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-amd.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-fork.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:934:15)
    at v.resolve (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js:4:760)
    at /Users/johndoe/repos/test_app/node_modules/prettier/index.js:59236:21
    at Array.map (<anonymous>)
    at Object.load (/Users/johndoe/repos/test_app/node_modules/prettier/index.js:59228:61)
    at Object.load [as loadPlugins] (/Users/johndoe/repos/test_app/node_modules/prettier/index.js:15770:23)
    at /Users/johndoe/repos/test_app/node_modules/prettier/index.js:59302:28
    at Object.Success [as format] (/Users/johndoe/repos/test_app/node_modules/prettier/index.js:59324:12)
    at t.default.<anonymous> (/Users/johndoe/.vscode/extensions/esbenp.prettier-vscode-8.2.0/src/PrettierEditService.ts:477:45)
    at Generator.next (<anonymous>)
    at i (/Users/johndoe/.vscode/extensions/esbenp.prettier-vscode-8.2.0/dist/extension.js:1:7027)

[ntotten]

For plugins installed in node_modules, you don’t need to set any config. Remove the plugins setting and it should work.

[alicanerdogan]

Workaround is using a .prettierrc.js with a bit help of module resolution in case anyone having a similar problem

module.exports = {
  tabWidth: 2,
  useTabs: false,
  semi: false,
  singleQuote: true,
  trailingComma: 'none',
  arrowParens: 'avoid',
  plugins: [require.resolve('prettier-plugin-organize-imports')]
}