Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Crashes with ESM prettier.config.js w/out prettier dependency in project #3298

Open
karlhorky opened this issue Feb 5, 2024 · 6 comments
Open

Comments

@karlhorky
Copy link
Contributor

karlhorky commented Feb 5, 2024

Summary

The Prettier VS Code extension ([email protected]) currently crashes when:

  1. no prettier dependency installed in package.json
  2. "type": "module" in package.json
  3. prettier.config.js with ESM

Github Repository to Reproduce Issue

Reproduction repo: https://github.com/karlhorky/prettier-vscode-10-1-0-esm-crash

Steps To Reproduce:

  1. Clone the reproduction repo above (or copy the code below into new files)
    package.json

    {
      "type": "module",
      "main": "index.js"
    }

    prettier.config.js

    const config = {};
    export default config;

    index.js

        console.log(
      'abc'
              )
  2. Try to format index.js using the VS Code Prettier extension

Expected result

Formatting should work

Actual result

The extension crashes (see text log at bottom of issue):

Screenshot 2024-02-05 at 17 45 30

This is because the VS Code extension uses the old Prettier v2 internally - because the PR from @sosukesuzuki upgrading to Prettier v3 by default was reverted:

Additional information

Feel free to attach a screenshot.

VS Code Version:

Version: 1.86.0
Commit: 05047486b6df5eb8d44b2ecd70ea3bdf775fd937
Date: 2024-01-31T10:29:11.933Z
Electron: 27.2.3
ElectronBuildId: 26495564
Chromium: 118.0.5993.159
Node.js: 18.17.1
V8: 11.8.172.18-electron.0
OS: Darwin arm64 23.3.0

Prettier Extension Version: [email protected]

OS and version: macOS Sonoma 14.3 (23D56)

Prettier Log Output

["INFO" - 5:28:43 PM] Extension Name: esbenp.prettier-vscode.
["INFO" - 5:28:43 PM] Extension Version: 10.1.0.
["INFO" - 5:28:53 PM] Formatting file:///Users/k/p/prettier-vscode-10-1-0-esm-crash/index.js
["ERROR" - 5:28:53 PM] Error resolving prettier configuration for /Users/k/p/prettier-vscode-10-1-0-esm-crash/index.js
["ERROR" - 5:28:53 PM] require() of ES Module /Users/k/p/prettier-vscode-10-1-0-esm-crash/prettier.config.js from /Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js not supported.
Instead change the require of prettier.config.js in /Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js to a dynamic import() which is available in all CommonJS modules.
Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/k/p/prettier-vscode-10-1-0-esm-crash/prettier.config.js from /Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js not supported.
Instead change the require of prettier.config.js in /Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js to a dynamic import() which is available in all CommonJS modules.
    at Function.<anonymous> (node:electron/js2c/asar_bundle:2:13327)
    at l._load (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:173:5635)
    at r._load (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:170:29791)
    at t._load (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:135:35292)
    at Module.patchedRequire [as require] (/Users/k/.vscode/extensions/github.copilot-1.156.0/dist/extension.js:104:43169)
    at module2.exports (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:83:61)
    at loadJs2 (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:8050:22)
    at Explorer.loadFileContent (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:8449:36)
    at Explorer.createCosmiconfigResult (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:8453:40)
    at Explorer.loadSearchPlace (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:8438:35)
    at async Explorer.searchDirectory (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:8428:31)
    at async run (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:8413:26)
    at async Explorer.search (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/third-party.js:8407:24)
    at async Object.resolveConfigFile (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/node_modules/prettier/index.js:18499:22)
    at async t.ModuleResolver.resolveConfig (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/dist/extension.js:1:6697)
    at async t.ModuleResolver.getResolvedConfig (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/dist/extension.js:1:7529)
    at async t.default.format (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/dist/extension.js:1:14563)
    at async t.PrettierEditProvider.provideEdits (/Users/k/.vscode/extensions/esbenp.prettier-vscode-10.1.0/dist/extension.js:1:12672)
    at async z.provideDocumentFormattingEdits (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:150:93866)

cc @ntotten

@karlhorky
Copy link
Contributor Author

Cause

This is because the VS Code extension uses the old Prettier v2 internally - because the PR from @sosukesuzuki upgrading to Prettier v3 by default was reverted:

...and Prettier v2 ([email protected]) also breaks with a similar error:

$ pnpm prettier --version      
2.8.8
$ pnpm prettier index.js --write                  
[error] Invalid configuration file `index.js`: require() of ES Module /Users/k/p/prettier-vscode-10-1-0-esm-crash/prettier.config.js from /Users/k/p/prettier-vscode-10-1-0-esm-crash/node_modules/.pnpm/[email protected]/node_modules/prettier/third-party.js not supported.
[error] Instead change the require of prettier.config.js in /Users/k/p/prettier-vscode-10-1-0-esm-crash/node_modules/.pnpm/[email protected]/node_modules/prettier/third-party.js to a dynamic import() which is available in all CommonJS modules.

@karlhorky
Copy link
Contributor Author

Workaround

Add Prettier v3 to your dependencies in every project 😬

{
  "type": "module",
  "main": "index.js",
  "dependencies": {
+    "prettier": "3.2.5"
  }
}

@karlhorky
Copy link
Contributor Author

Fix

@ntotten would you accept a new PR upgrading to Prettier v3 by default again in the Prettier VS Code extension?

Prettier v2 is pretty old now (April 2023) and the alphas of Prettier v4 are dropping now...

@karlhorky karlhorky changed the title Crash when using ESM prettier.config.js without prettier dependency in package.json Crashes with ESM prettier.config.js w/out prettier dependency in project Feb 5, 2024
@noelforte
Copy link

Just ran across this myself and thought to check the GH issues— @karlhorky instead of using a local dependency in every project there is another temporary solution that I was able to use: install prettier globally and point the VSCode extension to that (latest) version instead:

My steps were as follows (adjust for your setup of course):

  1. pnpm add -g prettier
  2. In your (global or local) settings.json:
{
  "prettier.prettierPath": "<path-to-pnpm-store>/node_modules/prettier"
}

Reloaded and everything ran sucessfully, hope this works for you and anyone else that stumbles across this bug until v3/v4 gets added!

@aminya
Copy link

aminya commented Apr 1, 2024

I tried all of these settings, but none work.

Here's my prettier.config.mjs

import config from "prettier-config-atomic"
export default config

And there's the log

["ERROR" - 23:48:15] Invalid prettier configuration file detected.
{}

@ntotten
Copy link
Member

ntotten commented Aug 14, 2024

@karlhorky Yes, absolutely. We do support prettier 3.0.0 when installed in the project, but not out of the box. We actually did release a version with 3.0.0, but it broke so we reverted and nobody has time to get back to it. Here is the revert if you want to use that as a starting point: ad1d008

I suspect it is pretty close, just need somebody to get it over the finish.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants