Prettier-vscode: Can't format Settings.json file

[David-Else]

VS Code Version: 1.39.2

Prettier & Prettier Plugin Version: 3.2.0 using built in Prettier

OS and version: Centos 8

@ntotten I have the output open and when I get the error nothing changes, it does not get to the output. I simply change:

  "[jsonc]": {
    "editor.defaultFormatter": "vscode.json-language-features"
  },

to:

  "[jsonc]": {
    "editor.defaultFormatter": "prettier.prettier-vscode"
  },

and hit save. I now get a VS Code message appear, not the normal one on the right, but a smaller on on the left that says: (click to zoom)

and the file that won't work:

// Place your settings in this file to overwrite the default settings
{
  // VS Code 1.39
  // General settings
  "editor.fontSize": 15,
  "editor.renderWhitespace": "boundary",
  "editor.dragAndDrop": false,
  "editor.formatOnSave": true,
  "editor.minimap.enabled": false,
  "editor.detectIndentation": false,
  "editor.tabSize": 2,
  "editor.codeActionsOnSave": {
    "source.organizeImports": true
  },
  "workbench.activityBar.visible": false,
  "workbench.tree.renderIndentGuides": "none",
  "workbench.list.keyboardNavigation": "filter",
  "window.menuBarVisibility": "hidden",
  "window.enableMenuBarMnemonics": false,
  "window.titleBarStyle": "custom",
  "zenMode.restore": true,
  "zenMode.centerLayout": false,
  "zenMode.fullScreen": false,
  "git.autofetch": true,
  "git.enableSmartCommit": true,
  "git.decorations.enabled": false,
  "explorer.decorations.colors": false,
  "search.followSymlinks": false,
  "breadcrumbs.enabled": false,
  "markdown.preview.fontSize": 15,
  "terminal.integrated.fontSize": 15,
  // Privacy
  "telemetry.enableTelemetry": false,
  "extensions.showRecommendationsOnlyOnDemand": true,
  // Language settings
  "javascript.preferences.quoteStyle": "single",
  "typescript.updateImportsOnFileMove.enabled": "always",
  "files.exclude": {
    "**/*.js": {
      "when": "$(basename).ts"
    },
    "**/*.js.map": true
  },
  "[javascript]": {
    "editor.defaultFormatter": "prettier.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "prettier.prettier-vscode"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "prettier.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "prettier.prettier-vscode"
  },
  "[html]": {
    "editor.defaultFormatter": "prettier.prettier-vscode"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "prettier.prettier-vscode"
  },
  // Shell Format extension
  "shellformat.flag": "-i 4",
  // Live Server extension
  "liveServer.settings.donotShowInfoMsg": true,
  "liveServer.settings.ChromeDebuggingAttachment": true,
  "liveServer.settings.AdvanceCustomBrowserCmdLine": "/usr/bin/chromium-browser --remote-debugging-port=9222",
  // Spellright extension
  "spellright.language": [
    "English (British)"
  ],
  "spellright.documentTypes": [
    "markdown",
    "latex",
    "plaintext"
  ],
  // Markdown Preview Enhanced extension
  "markdown-preview-enhanced.usePandocParser": true,
  // "typescript.referencesCodeLens.enabled": true,
  // "javascript.referencesCodeLens.enabled": true,
}

[linsjb]

Not exactly the same issue for me. But since the last VS Code update Prettier bricks all extensions with the error message "Extension host terminated unexpectedly.".

[ntotten]

@David-Else Thanks for opening this. Can you share the full log output when you try to save the file. That will help me figure out at what point the issue is happening. Thanks!

[David-Else]

This is the output after trying to save the file and seeing the error.

[INFO - 09:09:14] Extension Name: esbenp.prettier-vscode.
[INFO - 09:09:14] Extension Version: 0.0.0.
[INFO - 09:09:14] No path provided, using bundled prettier.
[INFO - 09:09:14] No path provided, using bundled prettier.
[WARN - 09:09:14] Falling back to bundled version of prettier.
[INFO - 09:09:14] Enabling prettier for languages:
[
  "javascript",
  "mongo",
  "javascriptreact",
  "typescript",
  "typescriptreact",
  "json",
  "jsonc",
  "json5",
  "css",
  "postcss",
  "less",
  "scss",
  "graphql",
  "markdown",
  "mdx",
  "html",
  "vue",
  "yaml"
]
[INFO - 09:09:14] Enabling prettier for range supported languages:
[
  "javascript",
  "javascriptreact",
  "typescript",
  "typescriptreact",
  "json",
  "graphql"
]

[CiGit]

By opening global settings $HOME/.config/Code/Users/settings.json through Preferences: Open settings (JSON) I get that status bar error message.
This doesn't happen if the file is opened as a normal file. Neither by opening project settings (.vscode/settings.json)

[ntotten]

So is this only an issue with that one file? If so, I think we can close this issue.

[ExE-Boss]

Edit: Actually, Prettier for VSCode can and does format JSON with Comments, it’s just that VSCode doesn’t allow extensions direct access to settings.json.

Because of that, this is working as intended, but the issue title should be changed.

---

Old comment:

This happens with any file that is configured as “JSON with Comments”, because it has the jsonc language ID, instead of json. This also affects package.json, tsconfig.json and several other JSON with Comments config files (including .prettierrc and .prettierrc.json)

Prettier can format such files, as it uses a JSON parser that supports comments and trailing commas.

[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.