Format-on-save inserts invalid `value` modifiers in TypeScript imports when prettier path points to non-existing module

[AlCalzone]

Summary

I've configured VSCode to format files on save using the Prettier extension. Because I used yarn PnP a while back, the prettier path was pointing to a non-existing module. When saving in this situation, all TypeScript imports get an added (invalid) value modifier, even in type-only imports:

// before
import type { Driver } from "../driver/Driver"

// after
import type { value Driver } from "../driver/Driver"

This does not happen when executing Prettier on the CLI. This also does not happen if the prettier path isn't overridden.

Github Repository to Reproduce Issue

I made a video to demonstrate. If necessary, I can try to isolate the issue in a repo.

Steps To Reproduce:

Save a TypeScript file with imports.

Expected result

It should not add a value modifier to imports.

Actual result

it does.

Additional information

VS Code Version:

Version: 1.62.3 (user setup) Commit: ccbaa2d27e38e5afa3e5c21c1c7bef4657064247 Datum: 2021-11-17T08:11:14.551Z Electron: 13.5.2 Chrome: 91.0.4472.164 Node.js: 14.16.0 V8: 9.1.269.39-electron.0 Betriebssystem: Windows_NT x64 10.0.19043

Prettier Extension Version:

v9.0.0

OS and version:

Prettier Log Output

["INFO" - 22:14:51] Formatting file:///c%3A/Repositories/node-zwave-js/packages/zwave-js/src/lib/commandclass/SupervisionCC.ts
["INFO" - 22:14:51] Using config file at 'c:\Repositories\node-zwave-js\.prettierrc.js'
["ERROR" - 22:14:51] Error loading node module 'c:\Repositories\node-zwave-js\.yarn\sdks\prettier\index.js'
["ERROR" - 22:14:51] Cannot find module 'c:\Repositories\node-zwave-js\.yarn\sdks\prettier\index.js'
Require stack:
- c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\dist\extension.js
- c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\loader.js
- c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\bootstrap-amd.js
- c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\bootstrap-fork.js
Error: Cannot find module 'c:\Repositories\node-zwave-js\.yarn\sdks\prettier\index.js'
Require stack:
- c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\dist\extension.js
- c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\loader.js
- c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\bootstrap-amd.js
- c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\bootstrap-fork.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:934:15)
    at Module._load (internal/modules/cjs/loader.js:779:27)
    at Function.f._load (electron/js2c/asar_bundle.js:5:12913)
    at Function.n._load (c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\services\extensions\node\extensionHostProcess.js:113:28606)
    at Function.b._load (c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\services\extensions\node\extensionHostProcess.js:113:25193)
    at Function.h._load (c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\services\extensions\node\extensionHostProcess.js:103:60406)
    at Module.require (internal/modules/cjs/loader.js:1006:19)
    at h (c:\Users\domin\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\loader.js:4:699)
    at t.ModuleResolver.loadNodeModule (c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\src\ModuleResolver.ts:282:9)
    at t.ModuleResolver.<anonymous> (c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\src\ModuleResolver.ts:164:11)
    at Generator.next (<anonymous>)
    at c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\dist\extension.js:1:2825
    at new Promise (<anonymous>)
    at n (c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\dist\extension.js:1:2570)
    at t.ModuleResolver.logError [as getPrettierInstance] (c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\src\ModuleResolver.ts:88:7)
    at t.default.<anonymous> (c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\src\PrettierEditService.ts:363:27)
    at Generator.next (<anonymous>)
    at s (c:\Users\domin\.vscode\extensions\esbenp.prettier-vscode-9.0.0\dist\extension.js:1:7872)
["INFO" - 22:14:51] Using ignore file (if present) at c:\Repositories\node-zwave-js\.prettierignore
["INFO" - 22:14:51] File Info:
{
  "ignored": false,
  "inferredParser": "typescript"
}
["INFO" - 22:14:51] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 22:14:51] Prettier Options:
{
  "filepath": "c:\\Repositories\\node-zwave-js\\packages\\zwave-js\\src\\lib\\commandclass\\SupervisionCC.ts",
  "parser": "typescript",
  "useTabs": true,
  "tabWidth": 4,
  "endOfLine": "lf",
  "semi": true,
  "trailingComma": "all",
  "singleQuote": false,
  "printWidth": 80,
  "plugins": [
    {
      "parsers": {
        "babel": {
          "astFormat": "estree"
        },
        "babel-ts": {
          "astFormat": "estree"
        },
        "typescript": {
          "astFormat": "estree"
        },
        "vue": {
          "astFormat": "html"
        }
      }
    }
  ]
}
["INFO" - 22:14:52] Formatting completed in 0.191ms.

[hyphenized]

Reloading the window worked for me

[piotr-musialek-skyrise]

I also had this problem. There is also a SO thread about it with some votes: https://stackoverflow.com/questions/70564950/vscode-prettier-adds-value-to-imports-in-typescript-react

Reloading/restarting VSCode didn't work for me. I finally fixed it by upgrading Prettier in my local package.json from 2.2.1 to 2.5.0. I don't know if the extension is using my local Prettier or it has its own version. I think I even remember having a popup asking me to allow extension to use local Prettier (I definitely clicked Allow).

I also noticed that when you start reverting each line back to the state without value and save/format it keeps it intact. Only if you revert last change it goes back to adding value in all imports.

[thesanjeevsharma]

I restarted my extension host and it worked! 🎉

1. open the Command Palette - Ctrl/Cmd + Shift + p
2. search - Developer: Restart Extension Host and execute it.

[wolthers]

I'm in a Rush monorepo so suspecting the extension couldn't resolve the path to the prettier module. Updating to 2.7.0 and pointing vscode to the correct path did the trick for me.

.vscode/settings.json:

{
  "prettier.prettierPath": "./common/autoinstallers/rush-prettier/node_modules/prettier/index.js"
}

[github-actions[bot]]

This issue has been labeled as stale due to inactivity. Reply to keep this issue open.

[github-actions[bot]]

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.