[visual-studio-code] Visual Studio Code - Convert spaces to tabs

I have both TypeScript and HTML files in my project, in both files tabs are converted to spaces.

I want to turn the auto-conversion off and make sure that my project has only tabs.

Edit:

With this setting it seems to work in HTML files but not in TypeScript files.

{
  "editor.insertSpaces": false
}

This question is related to visual-studio-code tabs spaces

The answer is


To change tab settings, click the text area right to the Ln/Col text in the status bar on the bottom right of vscode window.

The name can be Tab Size or Spaces.

A menu will pop up with all available actions and settings.

enter image description here


Ctrl+Shift+P, then "Convert Indentation to Tabs"


Check this from official vscode setting:

// Controls whether `editor.tabSize#` and `#editor.insertSpaces` will be automatically detected when a file is opened based on the file contents.
"editor.detectIndentation": true,

// The number of spaces a tab is equal to. This setting is overridden based on the file contents when `editor.detectIndentation` is on.
"editor.tabSize": 4,

// Config the editor that making the "space" instead of "tab"
"editor.insertSpaces": true,

// Configure editor settings to be overridden for [html] language.
"[html]": {
    "editor.insertSpaces": true,
    "editor.tabSize": 2,
    "editor.autoIndent": false
}

{
  "editor.insertSpaces": true
}

True works for me.


If you want to use tabs instead of spaces

Try this:

  1. Go to File ? Preferences ? Settings or just press Ctrl + ,
  2. In the Search settings bar on top insert editor.insertSpaces
  3. You will see something like this: Editor: Insert Spaces and it will be probably checked. Just uncheck it as show in image below

Editor: Insert Spaces

  1. Reload Visual Studio Code (Press F1 ? type reload window ? press Enter)

If it doesn't worked try this:

It's probably because of installed plugin JS-CSS-HTML Formatter

(You can check it by going to File ? Preferences ? Extensions or just pressing Ctrl + Shift + X, in the Enabled list you will find JS-CSS-HTML Formatter)

If so you can modify this plugin:

  1. Press F1 ? type Formatter config ? press Enter (it will open the file formatter.json)
  2. Modify the file like this:
 4|    "indent_size": 1,
 5|    "indent_char": "\t"
——|
24|    "indent_size": 1,
25|    "indentCharacter": "\t",
26|    "indent_char": "\t",
——|
34|    "indent_size": 1,
35|    "indent_char": "\t",
36|    "indent_character": "\t"
  1. Save it (Go to File ? Save or just press Ctrl + S)
  2. Reload Visual Studio Code (Press F1 ? type reload window ? press Enter)

Below settings are worked well for me,

"editor.insertSpaces": false,
"editor.formatOnSave": true, // only if you want auto fomattting on saving the file
"editor.detectIndentation": false

Above settings will reflect and applied to every files. You don't need to indent/format every file manually.


File -> Preferences -> Settings or just press Ctrl + , and search for spaces, then just deactivate this option:

enter image description here

I had to reopen the file so the changes would take effect.


In my case, the problem was JS-CSS-HTML Formatter extension installed after january update. The default indent_char property is space. I uninstalled it and the weird behavior stops.


  1. Highlight your Code (in file)
  2. Click Tab Size in bottom righthand corner of application window Tab Size in bottom righthand corner of application window image
  3. Select the appropriate Convert Indentation to Tabs Select the appropriate Convert Indentation to Tabs image

If you want to change tabs to spaces in a lot of files, but don't want to open them individually, I have found that it works equally as well to just use the Find and Replace option from the left-most tools bar.

In the first box (Find), copy and paste a tab from the source code.

In the second box (Replace), enter the number of spaces that you wish to use (i.e. 2 or 4).

If you press the ... button, you can specify directories to include or ignore (i.e. src/Data/Json).

Finally, inspect the result preview and press Replace All. All files in the workspace may be affected.


Examples related to visual-studio-code

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received type undefined raised when starting react app Visual Studio Code PHP Intelephense Keep Showing Not Necessary Error Cannot edit in read-only editor VS Code How to setup virtual environment for Python in VS Code? Pylint "unresolved import" error in Visual Studio Code Why do I keep getting Delete 'cr' [prettier/prettier]? How to set up devices for VS Code for a Flutter emulator VSCode single to double quote automatic replace js 'types' can only be used in a .ts file - Visual Studio Code using @ts-check How can I clear the terminal in Visual Studio Code?

Examples related to tabs

Visual Studio Code - Convert spaces to tabs Sublime Text 3, convert spaces to tabs Bootstrap 3: Keep selected tab on page refresh Change tab bar tint color on iOS 7 Stacked Tabs in Bootstrap 3 C++ printing spaces or tabs given a user input integer Open link in new tab or window How to make a new line or tab in <string> XML (eclipse/android)? Find Active Tab using jQuery and Twitter Bootstrap How to make the tab character 4 spaces instead of 8 spaces in nano?

Examples related to spaces

Visual Studio Code - Convert spaces to tabs Removing spaces from a variable input using PowerShell 4.0 Sublime Text 3, convert spaces to tabs Read input numbers separated by spaces How do I convert a list into a string with spaces in Python? How to copy directories with spaces in the name How can I convert tabs to spaces in every file of a directory? How can I convert spaces to tabs in Vim or Linux? Adding whitespace in Java Converting a sentence string to a string array of words in Java