question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Use VSCode tab/spacing settings instead of prettier specific settings

See original GitHub issue

Summary

For GraphQL, the formatter seems to indent by 2 spaces even when VSCode is configured to indent by a different number, or by tabs. This behavior may be specific to GraphQL, I don’t see it with JSON.

Steps To Reproduce:

  1. Open a GraphQL file, such as query.graphql:

    query {
      foo {
        bar
      }
    }
    
  2. Try different indentation settings in VSCode, and run “format document” for each.

Expected result

Formatting uses VSCode’s selected indentation: tabs, spaces, number of spaces.

image

Actual result

Indentation is always done with 2 spaces.

Additional information

VS Code Version: 1.49.0-insider

Prettier Extension Version: v5.1.3

OS and version: Version 2004 (OS Build 19041.450)

Prettier Log Output

["INFO" - 9:33:15 AM] Formatting c:\path\to\query.graphql
["INFO" - 9:33:15 AM] Using ignore file (if present) at undefined
["INFO" - 9:33:15 AM] Using bundled version of prettier.
["INFO" - 9:33:15 AM] File Info:
{
  "ignored": false,
  "inferredParser": "graphql"
}
["INFO" - 9:33:15 AM] No local configuration (i.e. .prettierrc or .editorconfig) detected, falling back to VS Code configuration
["INFO" - 9:33:15 AM] Prettier Options:
{
  "arrowParens": "always",
  "bracketSpacing": true,
  "endOfLine": "lf",
  "htmlWhitespaceSensitivity": "css",
  "insertPragma": false,
  "jsxBracketSameLine": false,
  "jsxSingleQuote": false,
  "printWidth": 80,
  "proseWrap": "preserve",
  "quoteProps": "as-needed",
  "requirePragma": false,
  "semi": true,
  "singleQuote": false,
  "tabWidth": 2,
  "trailingComma": "es5",
  "useTabs": false,
  "vueIndentScriptAndStyle": false,
  "filepath": "c:\\path\\to\\query.graphql",
  "parser": "graphql"
}
["INFO" - 9:33:15 AM] Formatting completed in 33.6648ms.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:36 (19 by maintainers)

github_iconTop GitHub Comments

2reactions
JVimescommented, Dec 9, 2020

[@thorn0]: As one of the maintainers, I guess I’m more familiar with the project’s goals than you.

Maintainer’s don’t decide user goals. The community does not accept breaking VSCode’s main UI as a “goal”.

Prettier should read VSCode’s setting and VSCode should handle .editorconfig.

2reactions
JVimescommented, Sep 11, 2020

Why have two indentation settings, one unused, even in the status bar? I think extension-specific indentation is not a real use case, even in the status bar.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Unable to set tab width to 4 in prettier - Stack Overflow
First, remove any .prettierrc from the working directory. Because it overrides user settings and uses the default values.
Read more >
Options - Prettier
Indent lines with tabs instead of spaces. ... Setting indent_style in an .editorconfig file will configure Prettier's tab usage, unless overridden. (Tabs will...
Read more >
How to configure Prettier and VSCode - Gleb Bahmutov
Here is a nice feature - you can set custom Prettier settings for some files. For example, we can use 2 spaces to...
Read more >
Language-specific indentation settings in VS Code
Language-specific indentation settings in VS Code · Hit Shift+Command+P to bring up the action menu · Search for the Preferences: Configure Language Specific...
Read more >
VS Code: edits with 4-spaces, saves with 2-spaces - Super User
After setting it to 4, the file is now saved with 4 spaces. The Settings.json ... Ctrl-K Ctrl-F , is not using Prettier...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found