VSCode Prettier extension not working when using prettier.config.cjs with prettier-plugin-tailwindcss and pnpm

huangapple go评论63阅读模式
英文:

VSCode Prettier extension not working when using prettier.config.cjs with prettier-plugin-tailwindcss and pnpm

问题

我想要排序tailwindcss类别,所以

  • 使用prettier-plugin-tailwindcss并将prettier.config.cjs添加到项目的根目录,使用pnpm包管理器
  • VSCode Prettier扩展v9.15.0
  • package.json prettier "prettier": "2.8.8",
  • package.json 中有 "type": "module",
  • 这是一个TypeScript项目

获得以下2个错误:

错误1: 编辑器中的错误

prettier.config.cjs error

错误2: 保存任何文件时

["ERROR" - 20:13:52] 格式化文档时出错。
["ERROR" - 20:13:52] 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} 无法被克隆。
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} 无法被克隆。
	at new DOMException (node:internal/per_context/domexception:72:5)
	at Worker.postMessage (node:internal/worker:343:5)
	at t.PrettierWorkerInstance.callMethod (/home/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17460)
	at t.PrettierWorkerInstance.format (/home/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17078)
	at t.default.format (/home/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:14808)
	at async t.PrettierEditProvider.provideEdits (/home/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:11430)
	at async N.provideDocumentFormattingEdits (/usr/share/codium/resources/app/out/vs/workbench/api/node/extensionHostProcess.js:101:52602)
["INFO" - 20:13:52] 格式化完成,耗时11ms。

我尝试了以下操作:

  • 将文件扩展名从prettier.config.js更改为prettier.config.cjs,因为出现了ES模块错误。
  • prettier.config.cjs中添加了/* eslint-disable no-undef */以禁用编辑器错误,但仍在保存文件时出现格式化错误。
英文:

I want to sort tailwindcss classes so

  • Used prettier-plugin-tailwindcss and added prettier.config.cjs to root of the project as using pnpm package manager
  • VSCode Prettier extension v9.15.0
  • package.json prettier "prettier": "2.8.8",
  • package.json having "type": "module",
  • This is Typescript project

Getting following 2 errors:

Error 1: Error in editor

prettier.config.cjs error

Error 2: While saving any file

["ERROR" - 20:13:52] Error formatting document.
["ERROR" - 20:13:52] 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/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17460)
	at t.PrettierWorkerInstance.format (/home/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:17078)
	at t.default.format (/home/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:14808)
	at async t.PrettierEditProvider.provideEdits (/home/rajbharti/.vscode-oss/extensions/esbenp.prettier-vscode-9.15.0/dist/extension.js:1:11430)
	at async N.provideDocumentFormattingEdits (/usr/share/codium/resources/app/out/vs/workbench/api/node/extensionHostProcess.js:101:52602)
["INFO" - 20:13:52] Formatting completed in 11ms.

I tried following:

  • Renamed file extension from prettier.config.js to prettier.config.cjs as was getting ES module error.
  • Added /* eslint-disable no-undef */ to disable editor error in prettier.config.cjs, but still getting formatting error for files when saving

答案1

得分: 1

现在它也适用于 v9.16.0

英文:

Now it also works with v9.16.0.

答案2

得分: 0

回退到 Prettier 9.14.0(从 9.15.0)对我有效。

  1. 在 VS Code 中右键单击扩展,点击“安装其他版本...”。
  2. 从列表中选择 9.14.0(需要重新加载)。
  3. 进入 VSCode 设置,搜索“Extensions: Auto Update”。
  4. 将此设置更改为“none”,以避免将来扩展自动更新。
英文:

Reverting to Prettier 9.14.0 (from 9.15.0) fixes this for me.

  1. Right click on the extension in VS Code, click on "Install other version...".
  2. Choose 9.14.0 from the list (reload required)
  3. Go to your settings in VSCode, search for "Extensions: Auto Update".
  4. Change this setting to "none" to avoid the extension updating automatically in the future.

huangapple
  • 本文由 发表于 2023年6月21日 23:31:09
  • 转载请务必保留本文链接:https://go.coder-hub.com/76524940.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定