Custom Plugins in Prettier Config Breaks Prettier Extension

alicanerdogan commented 2 years ago

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:

Create a repo with the following .prettierrc

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

Add prettier-plugin-organize-imports as a custom plugin
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)

oskarmcd commented 2 years ago

👍 same here

alicanerdogan commented 2 years ago

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')]
}

ntotten commented 2 years ago

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

IanVS commented 2 years ago

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

Unfortunately, that doesn't work for me. ~~In my case it's also prettier-plugin-organize-imports that is causing trouble, so I wonder if it's specific to that particular plugin, or if it's an issue with all plugins.~~

Edit: nevermind, I'm using @trivago/prettier-plugin-sort-imports. Similar, but different. :)

zachhardesty7 commented 2 years ago

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

Also seeing this error and this doesn't work for me when using a global install of prettier and plugins. Doesn't matter if prettier.resolveGlobalModules is enabled or not. Perhaps it has to do with using nvm? The plugins are in the same folder as the prettier.prettierPath setting.

viceice commented 1 year ago

Same issue when using yarn pnp

["INFO" - 09:31:28] Formatting file:///~/gh/visualon/docker-buildpack/package.json
["INFO" - 09:31:28] Using config file at '~\gh\visualon\docker-buildpack\.prettierrc.json'
["INFO" - 09:31:28] Using ignore file (if present) at ~\gh\visualon\docker-buildpack\.prettierignore
["INFO" - 09:31:28] File Info:
{
  "ignored": false,
  "inferredParser": "json-stringify"
}
["INFO" - 09:31:28] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 09:31:28] Prettier Options:
{
  "filepath": "~\\gh\\visualon\\docker-buildpack\\package.json",
  "parser": "json-stringify",
  "useTabs": false,
  "tabWidth": 2,
  "printWidth": 160,
  "endOfLine": "lf",
  "singleQuote": true,
  "trailingComma": "es5",
  "plugins": [
    "prettier-plugin-package"
  ]
}
["ERROR" - 09:31:28] Error formatting document.
["ERROR" - 09:31:28] Cannot find module 'prettier-plugin-package'
Require stack:
- 
Require stack:
- ~\gh\visualon\docker-buildpack\.yarn\cache\prettier-npm-2.7.1-d1f40f5e1a-55a4409182.zip\node_modules\prettier\index.js
- ~\gh\visualon\docker-buildpack\.pnp.cjs
Error: Cannot find module 'prettier-plugin-package'
Require stack:
- 
Require stack:
- ~\gh\visualon\docker-buildpack\.yarn\cache\prettier-npm-2.7.1-d1f40f5e1a-55a4409182.zip\node_modules\prettier\index.js
- ~\gh\visualon\docker-buildpack\.pnp.cjs
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:987:15)
    at Function.require$$0.Module._resolveFilename (~\gh\visualon\docker-buildpack\.pnp.cjs:14353:54)
    at p.resolve (c:\Program Files\Microsoft VS Code\resources\app\out\vs\loader.js:4:761)
    at ~\gh\visualon\docker-buildpack\.yarn\cache\prettier-npm-2.7.1-d1f40f5e1a-55a4409182.zip\node_modules\prettier\index.js:37165:25
    at Array.map (<anonymous>)
    at Object.load (~\gh\visualon\docker-buildpack\.yarn\cache\prettier-npm-2.7.1-d1f40f5e1a-55a4409182.zip\node_modules\prettier\index.js:37160:65)
    at Object.load [as loadPlugins] (~\gh\visualon\docker-buildpack\.yarn\cache\prettier-npm-2.7.1-d1f40f5e1a-55a4409182.zip\node_modules\prettier\index.js:15932:23)
    at ~\gh\visualon\docker-buildpack\.yarn\cache\prettier-npm-2.7.1-d1f40f5e1a-55a4409182.zip\node_modules\prettier\index.js:37227:24
    at Object.Success [as format] (~\gh\visualon\docker-buildpack\.yarn\cache\prettier-npm-2.7.1-d1f40f5e1a-55a4409182.zip\node_modules\prettier\index.js:37243:12)
    at t.default.format (~\.vscode\extensions\esbenp.prettier-vscode-9.5.0\src\PrettierEditService.ts:463:45)
    at t.PrettierEditProvider.provideEdits (~\.vscode\extensions\esbenp.prettier-vscode-9.5.0\src\PrettierEditService.ts:322:22)
    at F.provideDocumentFormattingEdits (c:\Program Files\Microsoft VS Code\resources\app\out\vs\workbench\api\node\extensionHostProcess.js:87:45332)
["INFO" - 09:31:28] Formatting completed in 0.036ms.

viceice commented 1 year ago

Can this be an CWD issue?