Formatting failed if "with" keyword in import attributes but Prettier v3.4.2 and acorn support

[anilkumarum]

Summary

pPease update vscode extension in vscode marketplace
Formatting fails when the 'with' keyword is used in import attributes, but both Prettier v3.4.2 and Acorn support the use of the 'with' keyword in import attributes.

Steps To Reproduce:

import styleCss from "./style.css" with { type: "css" };
document.adoptedStyleSheets.push(styleCss);

Expected result

Format javascript file properly if "with" keyword in import attributes used

Actual result

SyntaxError: Unexpected token, expected "(" (1:41)

1 | import styleCss from "./style.css" with { type: "css" };
| ^
2 | document.adoptedStyleSheets.push(styleCss);

Additional information

Prettier v3.4.2 supports the 'with' keyword in import attributes. Please update your Prettier dependencies and the Prettier VSCode extension. Due to this issue, I was forced to use an alternative formatting tool.

VS Code Version:
Version: 1.89.1
Commit: dc96b837cf6bb4af9cd736aa3af08cf8279f7685
Date: 2024-05-07T05:16:23.416Z
Electron: 28.2.8
ElectronBuildId: 27744544
Chromium: 120.0.6099.291
Node.js: 18.18.2
V8: 12.0.267.19-electron.0
OS: Linux x64 5.15.0-126-generic

Prettier Extension Version: v11.0.0

OS and version:Linux

Prettier Log Output

SyntaxError: Unexpected token, expected "(" (1:42)
> 1 | import  styleCss from "./style.css" with { type: "css" };
    |                                          ^
  2 | document.adoptedStyleSheets.push(styleCss);
  3 |
  4 |

[thevalleyy]

Having the same issue

[vikiboss]

Hey there! Just wondering if there's any update on this? It looks like the VSCode prettier plugin might be running a slightly older version, which is causing it to flag the import attributes as syntax errors. 🤔

[leetcow]

I don't understand why there isn't an automated way to keep the VSCode extension on the latest release of prettier - in the least, let us plug in a custom version (actually maybe this is already possible)

edit: ok guys the answer is as simple as bun add -d prettier (or wtv your package manager's equivalent is).

the vscode extension will then rely on that version.

[bierdok]

Having the same issue 👎

[calvario31]

any workaround for this?

[bierdok]

You can install prettier awaiting the update.
Open a terminal in the vscode project root.

npm i prettier

[calvario31]

thanks