search

prettier / prettier-vscode

Visual Studio Code extension for Prettier
https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
MIT License
5.04k stars 446 forks source link

Not formatting on 9.15.0 when using plugin #3036

Closed s-montigny-desautels closed 11 months ago

s-montigny-desautels commented 11 months ago

Summary

The extension don't format code when using plugin like prettier-plugin-tailwindcss.

Github Repository to Reproduce Issue

https://github.com/s-montigny-desautels/vscode-prettier-plugin-issue

Steps To Reproduce:

  1. Install deps (pnpm install)
  2. Open the file src/main.js
  3. Run the command Format Document With... and select prettier.

Expected result

The import is aligned and the code is formatted.

Actual result

Nothing is formatted.

Additional information

Formatting work with version 9.14.0. The code is formatted when using prettier in the terminal.

VS Code Version: 1.79.2

Prettier Extension Version: 9.15.0

OS and version: Fedora 38

Prettier Log Output

["INFO" - 4:14:48 PM] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 4:14:48 PM] Prettier Options:
{
  "filepath": "/home/shean/tmp/vscode-prettier-bug/src/main.js",
  "parser": "babel",
  "useTabs": true,
  "printWidth": 100,
  "trailingComma": "es5",
  "plugins": [
    {
      "options": {
        "tailwindConfig": {
          "since": "0.0.0",
          "type": "string",
          "category": "Tailwind CSS",
          "description": "Path to Tailwind configuration file"
        },
        "tailwindAttributes": {
          "since": "0.3.0",
          "type": "string",
          "array": true,
          "default": [
            {
              "value": []
            }
          ],
          "category": "Tailwind CSS",
          "description": "List of attributes/props that contain sortable Tailwind classes"
        },
        "tailwindFunctions": {
          "since": "0.3.0",
          "type": "string",
          "array": true,
          "default": [
            {
              "value": []
            }
          ],
          "category": "Tailwind CSS",
          "description": "List of functions and tagged templates that contain sortable Tailwind classes"
        }
      },
      "parsers": {
        "html": {
          "astFormat": "html"
        },
        "glimmer": {
          "astFormat": "glimmer"
        },
        "lwc": {
          "astFormat": "html"
        },
        "angular": {
          "astFormat": "html"
        },
        "vue": {
          "astFormat": "html"
        },
        "css": {
          "astFormat": "postcss"
        },
        "scss": {
          "astFormat": "postcss"
        },
        "less": {
          "astFormat": "postcss"
        },
        "babel": {
          "astFormat": "estree"
        },
        "babel-flow": {
          "astFormat": "estree"
        },
        "flow": {
          "astFormat": "estree"
        },
        "typescript": {
          "astFormat": "estree"
        },
        "babel-ts": {
          "astFormat": "estree"
        },
        "espree": {
          "astFormat": "estree"
        },
        "meriyah": {
          "astFormat": "estree"
        },
        "__js_expression": {
          "astFormat": "estree"
        }
      },
      "printers": {}
    }
  ]
}
["ERROR" - 4:14:48 PM] Error formatting document.
["ERROR" - 4:14:48 PM] parse(a,m,f={}){let{context:s,generateRules:l}=dI(f),c=Wm(ws,e,f);c.astFormat in vv&&(f.printer=vv[c.astFormat]...<omitted>...d} could not be cloned.
DataCloneError: parse(a,m,f={}){let{context:s,generateRules:l}=dI(f),c=Wm(ws,e,f);c.astFormat in vv&&(f.printer=vv[c.astFormat]...<omitted>...d} could not be cloned.
    at new DOMException (node:internal/per_context/domexception:72:5)
    at Worker.postMessage (node:internal/worker:343:5)
    at t.PrettierWorkerInstance.callMethod (/home/shean/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17460)
    at t.PrettierWorkerInstance.format (/home/shean/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17078)
    at t.default.format (/home/shean/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:14808)
    at async t.PrettierEditProvider.provideEdits (/home/shean/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:11430)
    at async U.provideDocumentFormattingEdits (/usr/share/code/resources/app/out/vs/workbench/api/node/extensionHostProcess.js:101:45790)
["INFO" - 4:14:48 PM] Formatting completed in **3ms.**
zwgnr commented 11 months ago

having the same issue when adding any plugins.

have tried, require("prettier-plugin-organize-imports"), require("prettier-plugin-astro"), require("prettier-plugin-tailwindcss"),

formatting works without any plugins, but as soon as one gets enabled I am getting the error as above.

Also, just tried rolling back to 9.14 and everything works.

tebuevd commented 11 months ago

Same here. Rolled back to 9.14.0

theblang commented 11 months ago

Ditto here, rolled back to 9.14.0 using the Install another version option in the Uninstall dropdown.

The stacktrace I'm getting on 9.15.0 is:

["INFO" - 5:24:21 PM] Extension Name: esbenp.prettier-vscode.
["INFO" - 5:24:21 PM] Extension Version: 9.15.0.
["INFO" - 5:24:25 PM] Formatting file:///Users/theblang/Development/Pedago/back_royal/<redacted>.js
["INFO" - 5:24:25 PM] Using config file at '/Users/theblang/Development/Pedago/back_royal/.prettierrc.json'
["ERROR" - 5:24:25 PM] Error resolve node module 'prettier-plugin-tailwindcss'
["ERROR" - 5:24:25 PM] Cannot find module 'prettier-plugin-tailwindcss'
Require stack:
- /Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.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-tailwindcss'
Require stack:
- /Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.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 Module._resolveFilename (node:internal/modules/cjs/loader:1010:15)
    at Function.s._resolveFilename (node:electron/js2c/utility_init:2:2740)
    at Function.g.resolve (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js:4:709)
    at t.ModuleResolver.resolveNodeModule (/Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:6560)
    at /Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:6794
    at Array.map (<anonymous>)
    at t.ModuleResolver.resolveConfigPlugins (/Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:6724)
    at t.ModuleResolver.getResolvedConfig (/Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:6106)
    at t.default.format (/Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:13321)
    at t.PrettierEditProvider.provideEdits (/Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:11430)
    at U.provideDocumentFormattingEdits (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:101:45790)
["INFO" - 5:24:25 PM] PrettierInstance:
{
  "modulePath": "/Users/theblang/Development/Pedago/back_royal/.yarn/sdks/prettier/index.js",
  "importResolver": {},
  "callMethodResolvers": {},
  "currentCallMethodId": 0,
  "version": "2.6.2"
}
["INFO" - 5:24:25 PM] Using ignore file (if present) at /Users/theblang/Development/Pedago/back_royal/.prettierignore
["INFO" - 5:24:25 PM] File Info:
{
  "ignored": false,
  "inferredParser": "babel"
}
["INFO" - 5:24:25 PM] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 5:24:25 PM] Prettier Options:
{
  "filepath": "/Users/theblang/Development/Pedago/back_royal/<redacted>.js",
  "parser": "babel",
  "printWidth": 120,
  "semi": true,
  "singleQuote": true,
  "tabWidth": 4,
  "useTabs": false,
  "trailingComma": "all",
  "arrowParens": "avoid",
  "plugins": [
    "prettier-plugin-tailwindcss"
  ]
}
["ERROR" - 5:24:25 PM] Error formatting document.
["ERROR" - 5:24:25 PM] Cannot find module 'prettier-plugin-tailwindcss'
Require stack:
- 
Require stack:
- /Users/theblang/Development/Pedago/back_royal/.yarn/cache/prettier-npm-2.6.2-05918420da-48d08dde8e.zip/node_modules/prettier/index.js
- /Users/theblang/Development/Pedago/back_royal/.pnp.cjs
Error: Cannot find module 'prettier-plugin-tailwindcss'
Require stack:
- 
Require stack:
- /Users/theblang/Development/Pedago/back_royal/.yarn/cache/prettier-npm-2.6.2-05918420da-48d08dde8e.zip/node_modules/prettier/index.js
- /Users/theblang/Development/Pedago/back_royal/.pnp.cjs
    at Module._resolveFilename (node:internal/modules/cjs/loader:1010:15)
    at require$$0.Module._resolveFilename (/Users/theblang/Development/Pedago/back_royal/.pnp.cjs:48716:54)
    at resolve (node:internal/modules/cjs/helpers:108:19)
    at /Users/theblang/Development/Pedago/back_royal/.yarn/cache/prettier-npm-2.6.2-05918420da-48d08dde8e.zip/node_modules/prettier/index.js:39110:25
    at Array.map (<anonymous>)
    at Object.load (/Users/theblang/Development/Pedago/back_royal/.yarn/cache/prettier-npm-2.6.2-05918420da-48d08dde8e.zip/node_modules/prettier/index.js:39105:65)
    at Object.load [as loadPlugins] (/Users/theblang/Development/Pedago/back_royal/.yarn/cache/prettier-npm-2.6.2-05918420da-48d08dde8e.zip/node_modules/prettier/index.js:15998:27)
    at /Users/theblang/Development/Pedago/back_royal/.yarn/cache/prettier-npm-2.6.2-05918420da-48d08dde8e.zip/node_modules/prettier/index.js:39172:24
    at Object.format (/Users/theblang/Development/Pedago/back_royal/.yarn/cache/prettier-npm-2.6.2-05918420da-48d08dde8e.zip/node_modules/prettier/index.js:39188:12)
    at MessagePort.<anonymous> (/Users/theblang/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/worker/prettier-instance-worker.js:1:717)
["INFO" - 5:24:25 PM] Formatting completed in 64ms.
lukefiji commented 11 months ago

Likewise, getting the error below @ v9.15.0. Rolling back to v9.14 allows it to work once again

["INFO" - 3:53:18 PM] Formatting file:///Users/luke/Git/type-blitz/src/components/CharacterList.tsx
["INFO" - 3:53:18 PM] Using config file at '/Users/luke/Git/type-blitz/.prettierrc.cjs'
["INFO" - 3:53:18 PM] PrettierInstance:
{
  "modulePath": "/Users/luke/Git/type-blitz/node_modules/prettier/index.js",
  "importResolver": {},
  "callMethodResolvers": {},
  "currentCallMethodId": 15,
  "version": "2.8.8"
}
["INFO" - 3:53:18 PM] Using ignore file (if present) at /Users/luke/Git/type-blitz/.prettierignore
["INFO" - 3:53:18 PM] File Info:
{
  "ignored": false,
  "inferredParser": "typescript"
}
["INFO" - 3:53:18 PM] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 3:53:18 PM] Prettier Options:
{
  "filepath": "/Users/luke/Git/type-blitz/src/components/CharacterList.tsx",
  "parser": "typescript",
  "singleQuote": true,
  "tailwindConfig": "./tailwind.config.js",
  "plugins": [
    "/Users/luke/Git/type-blitz/node_modules/prettier-plugin-organize-imports/index.js",
    {
      "options": {
        "tailwindConfig": {
          "since": "0.0.0",
          "type": "string",
          "category": "Tailwind CSS",
          "description": "Path to Tailwind configuration file"
        },
        "tailwindAttributes": {
          "since": "0.3.0",
          "type": "string",
          "array": true,
          "default": [
            {
              "value": []
            }
          ],
          "category": "Tailwind CSS",
          "description": "List of attributes/props that contain sortable Tailwind classes"
        },
        "tailwindFunctions": {
          "since": "0.3.0",
          "type": "string",
          "array": true,
          "default": [
            {
              "value": []
            }
          ],
          "category": "Tailwind CSS",
          "description": "List of functions and tagged templates that contain sortable Tailwind classes"
        }
      },
      "parsers": {
        "html": {
          "astFormat": "html"
        },
        "glimmer": {
          "astFormat": "glimmer"
        },
        "lwc": {
          "astFormat": "html"
        },
        "angular": {
          "astFormat": "html"
        },
        "vue": {
          "astFormat": "html"
        },
        "css": {
          "astFormat": "postcss"
        },
        "scss": {
          "astFormat": "postcss"
        },
        "less": {
          "astFormat": "postcss"
        },
        "babel": {
          "astFormat": "estree"
        },
        "babel-flow": {
          "astFormat": "estree"
        },
        "flow": {
          "astFormat": "estree"
        },
        "typescript": {
          "astFormat": "estree"
        },
        "babel-ts": {
          "astFormat": "estree"
        },
        "espree": {
          "astFormat": "estree"
        },
        "meriyah": {
          "astFormat": "estree"
        },
        "__js_expression": {
          "astFormat": "estree"
        }
      },
      "printers": {}
    }
  ]
}
["ERROR" - 3:53:18 PM] Error formatting document.
["ERROR" - 3:53:18 PM] parse(a,m,f={}){let{context:s,generateRules:l}=dI(f),c=Wm(ws,e,f);c.astFormat in vv&&(f.printer=vv[c.astFormat]...<omitted>...d} could not be cloned.
DataCloneError: parse(a,m,f={}){let{context:s,generateRules:l}=dI(f),c=Wm(ws,e,f);c.astFormat in vv&&(f.printer=vv[c.astFormat]...<omitted>...d} could not be cloned.
    at new DOMException (node:internal/per_context/domexception:72:5)
    at Worker.postMessage (node:internal/worker:343:5)
    at t.PrettierWorkerInstance.callMethod (/Users/luke/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17460)
    at t.PrettierWorkerInstance.format (/Users/luke/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17078)
    at t.default.format (/Users/luke/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:14808)
    at t.PrettierEditProvider.provideEdits (/Users/luke/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:11430)
    at U.provideDocumentFormattingEdits (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:101:45790)
["INFO" - 3:53:18 PM] Formatting completed in 13ms.
Darkksideyoda commented 11 months ago

Downgrading to 9.14.0 works for now

byun618 commented 11 months ago

me neither. i did downgrade version. works well

Error: Cannot find module 'my-custom'
Require stack:
- /Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/node_modules/prettier/index.js
- /Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.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 Module._resolveFilename (node:internal/modules/cjs/loader:1010:15)
    at Function.s._resolveFilename (node:electron/js2c/utility_init:2:2740)
    at g.resolve (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js:4:709)
    at Object.transform (/Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/node_modules/prettier/index.js:18425:34)
    at run (/Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/node_modules/prettier/third-party.js:8418:53)
    at Explorer.search (/Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/node_modules/prettier/third-party.js:8407:24)
    at Object.resolveConfigFile (/Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/node_modules/prettier/index.js:18499:22)
    at t.ModuleResolver.getResolvedConfig (/Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:5534)
    at t.default.format (/Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:13321)
    at t.PrettierEditProvider.provideEdits (/Users/sanghyunbyun/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:11430)
    at U.provideDocumentFormattingEdits (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:101:45790)
LeezQ commented 11 months ago

the same

["ERROR" - 11:12:23] Error formatting document.
["ERROR" - 11:12:23] parse(a,m,f={}){let{context:s,generateRules:l}=dI(f),c=Wm(ws,e,f);c.astFormat in vv&&(f.printer=vv[c.astFormat]...<omitted>...d} could not be cloned.
DataCloneError: parse(a,m,f={}){let{context:s,generateRules:l}=dI(f),c=Wm(ws,e,f);c.astFormat in vv&&(f.printer=vv[c.astFormat]...<omitted>...d} could not be cloned.
    at new DOMException (node:internal/per_context/domexception:72:5)
    at Worker.postMessage (node:internal/worker:343:5)
    at t.PrettierWorkerInstance.callMethod (/Users/leezq/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17460)
    at t.PrettierWorkerInstance.format (/Users/leezq/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17078)
    at t.default.format (/Users/leezq/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:14808)
    at t.PrettierEditProvider.provideEdits (/Users/leezq/.vscode/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:11430)
    at U.provideDocumentFormattingEdits (/Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/api/node/extensionHostProcess.js:101:45790)
["INFO" - 11:12:23] Formatting completed in 4ms.
phuctm97 commented 11 months ago

Faced same issue with 9.15.0. Downgrading to 9.14.0 works for now.

Gunyon commented 11 months ago

+1

sosukesuzuki commented 11 months ago

Has anyone else had this bug happen outside of prettier-plugin-tailwindcss?

pablovieiras commented 11 months ago

Has anyone else had this bug happen outside of prettier-plugin-tailwindcss?

I had with @trivago/prettier-plugin-sort-imports

OFK0 commented 11 months ago

Hi, I got the same error when I'm using 9.15.0 I installed 9.13.0 and it is fixed right now. The tailwind plugin is incompatible with the prettier@9.15.0 vs code extension.

Thanks, everyone!

rico-ocepek commented 11 months ago

To downgrade just open the prettier extension page in VSC and click the little arrow next to "Uninstall"

image
Muralidevan27 commented 11 months ago

Thanks guys rolling back to 9.14.0 version 👍

holdenmatt commented 11 months ago

So happy I found this issue! I wasted half a day trying to figure out why this mysteriously stopped working. Rolling back to 9.14.0 fixed it, yay!

dewodt commented 11 months ago

Thank god I found this Issue.

ibqn commented 11 months ago

same for me, I am also affected by this error message, using prettier together with the tailwindcss plugin

module.exports = {
  endOfLine: 'lf',
  semi: false,
  singleQuote: true,
  tabWidth: 2,
  trailingComma: 'es5',
  plugins: [require('prettier-plugin-tailwindcss')],
}

what a great release! downgrading from 9.15 back to 9.14 fixes the issue as a workaround.

ibqn commented 11 months ago

changing the way plugin is imported also seems to fix the issue i.e.

changing plugins: [require('prettier-plugin-tailwindcss')] to plugins: ['prettier-plugin-tailwindcss']

xenostar commented 11 months ago

Also getting this error. Our .prettierrc is configured like so:

module.exports = require('@company/prettier-config');

The package links to a very basic json file:

{
  "printWidth": 100,
  // Other stuff left out
}

Also getting a similar error to those above when attempting to use prettier to format:

["ERROR" - 1:49:31 PM] Cannot find module '@company/prettier-config'

This was working fine pre 9.15, reverting to 9.14 fixes it.

lucasoz commented 11 months ago

same issue

lucasoz commented 11 months ago

@ibqn thanks, your idea works

MaheshNat commented 11 months ago

+1

devheedoo commented 11 months ago

Downgrading to 9.14.0 works here, too.

I'm using @trivago/prettier-plugin-sort-imports and prettier-plugin-tailwindcss.

["INFO" - 9:49:38 AM] Extension Name: esbenp.prettier-vscode. ["INFO" - 9:49:38 AM] Extension Version: 9.15.0. ["INFO" - 9:49:41 AM] Formatting file://MY_LOCAL_PATH/MY_LOCAL_FILE.tsx ["INFO" - 9:49:41 AM] Using config file at 'MY_LOCAL_PATH/.prettierrc.js' ["ERROR" - 9:49:41 AM] Error resolve node module '@trivago/prettier-plugin-sort-imports' ["ERROR" - 9:49:41 AM] Cannot find module '@trivago/prettier-plugin-sort-imports' Require stack:

...

HeeBooo commented 11 months ago

It seems that the prettier-plugin-tailwindcss plugin is not compatible.

bastien-pruvost commented 11 months ago

Same issue, when i use the plugin @trivago/prettier-plugin-sort-imports i have a DataCloneError. Downgrade to 9.14.0 worked for me.

Iipal commented 11 months ago

+1, using @trivago/prettier-plugin-sort-imports and prettier-plugin-tailwindcss, and facing the same issues

AlCalzone commented 11 months ago

The issue also happens with prettier-plugin-organize-imports

github-actions[bot] commented 8 months ago

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.