Visual Studio Code: Format Does Not Use Indent Settings

Question

When using the Format Code command in Visual Studio code, this does not match my indentation settings ( "editor.tabSize": 2 ). Instead, tab size 4 is used. Any ideas why this is happening?

Thank!

Answer 1

The number of spaces for formatting is taken from another place. I am using version 1.0, and this is what I did to fix it (I assume that spaces are used instead of spaces):

At the bottom of the editor on the right, click "Spaces: #":

Then the menu appears at the top. Select "Indents Using Spaces":

Finally, you can choose how many spaces you want to separate from your files.

The next time you format the file, you can get the specified interval.

Answer 2

Visual Studio Code detects the current default indent and uses this - ignoring .editorconfig

Set also "editor.detectIndentation" to false

(Files → Settings → Settings)

Answer 3

If @Maleki's answer doesn't work for you, check and see if there is a .editorconfig file in the project folder.

For example, the Angular CLI generates one with a new project that looks like this

 # Editor configuration, see http://editorconfig.org root = true [*] charset = utf-8 indent_style = space indent_size = 2 insert_final_newline = true trim_trailing_whitespace = true [*.md] max_line_length = off trim_trailing_whitespace = false 

Here you need to change indent_size , since it seems like it will override something in the .vscode or user preferences.

Answer 4

For me, this problem was caused by using the prettier VSCode plugin without having a prettier configuration file in the workspace.

Disabling the plugin solved the problem. Perhaps this could also be fixed by relying on a prettier config.

Answer 5

If you use a plugin (in my case Vetur, for vue.js), it can set its own tab formatting settings.

Open your settings, find "format" and view the corresponding plugin settings that can overwrite the global tab format. It worked for me; As soon as I updated the Vetur tab settings to suit my preferences (4 tabs in my case), formatting .vue documents began to work correctly:

Answer 6

the settings below solved my problem

  "editor.detectIndentation": false, "editor.insertSpaces": false, "editor.tabSize": 2, 

Answer 7

Most likely, you have some formatting extension installed, for example. JS-CSS-HTML Formatter .

If so, just open the command palette, enter "Formatter" and select Formatter Config . Then edit the value "indent_size" as you like.

PS Do not forget to restart Visual Studio Code after editing :)

Answer 8

If you came here from Google because tabs are not indented, this could also be because Tab Moves Focus is turned on. This is located in the lower right corner, and if you have a large enough monitor, you can skip it despite highlighting it.

Press the green area or Ctrl + M to stop it. I’m not sure that it can be completely disabled, and then I don’t know why the code editor wants to fit in with something.

Answer 9

I had a similar problem - no matter what I did, I couldn't force the tab size to stick to 2, even if it was in my user settings - which was ultimately due to the EditorConfig extension . It searches for the .editorconfig file in your current working directory and if it does not find it (or the one it finds does not indicate root=true ), it will continue to search for parent directories until it finds it.

Turns out I had a .editorconfig in the parent directory of the directory where I put all my new code projects, and it pointed to tabSize equal to 4. Deleting this file fixed my problem.

Answer 10

I sometimes have the same problem. VSCode just suddenly faints and completely ignores any indentation settings that I'm talking about, although it was a fingerprint of the same file as it was all day.

I have editor.tabSize set to 2 (and also editor.formatOnSave set to true). When VSCode obfuscates the file, I use the options at the bottom of the editor to change the type and size of the indentation, in the hope that something will work, but VSCode insists on actually using indentation of size 4.

To fix? Restart VSCode. It should return with an indent status showing something wrong (in my case, 4). For me, I had to change the setting and then save it in order to actually make the changes, but this is possible due to my editor.formatOnSave parameter.

I did not understand why this happens, but for me it is usually when I edit a nested object in a JS file. This will suddenly make a very strange indentation inside the object, although I worked in this file for a while, and it was indented just fine.

Answer 11

VSCode Vetur plugin; used for VueJS applications, overrides settings for me.

Setting vetur.format.options.tabSize for my preferred number of spaces made it work.

Answer 12

I think vscode uses autopep8 to format .py by default.

"PEP 8 - Style Guide for Python Code | Python.org"

According to this website, the following might explain why vscode always uses 4 spaces.

Use 4 spaces per indent level.