如何更改 Visual Studio 代码中的缩进？

Question

对于每个打字稿文件 visual studio 代码使用 8 个空格的自动缩进。这对我来说有点过分了，但我找不到更改它的地方。

也许它可以作为设置使用，但名称不同，因为我找不到与缩进相关的任何内容。

更新

我目前正在使用 Prettier code formatter，它通过在保存时自动格式化（如果没有语法错误）解决了所有格式问题

Answer 1

在右下角的工具栏中，您会看到如下所示的项目：单击它后，您将获得使用 space 或制表符缩进的选项。选择缩进类型后，您将可以选择更改缩进的大小。在上面的示例中，缩进设置为每次缩进 4 space 个字符。如果选择制表符作为缩进字符，那么您将看到 Tab Size 而不是 Spaces

如果您想将此应用于所有文件而不是单个文件，请覆盖 用户设置 [=32] 中的 Editor: Tab Size 和 Editor: Insert Spaces 设置=] 或 工作space 设置 取决于您的需要

编辑 1

要访问您的用户或工作space 设置，请转到首选项 -> 设置。根据您的需要确认您位于 User 或 Workspace 选项卡上，然后使用搜索栏找到设置。您可能还想禁用 Editor: Detect Indentation，因为此设置将覆盖您为 Editor: Insert Spaces 和 Editor: Tab Size 设置的设置，当它启用时

Answer 2

根据编程语言更改缩进:

打开命令面板（CtrlShiftP | macOS:⇧⌘P).
类型和 select：首选项：配置语言特定设置...（命令 ID：workbench.action.configureLanguageBasedSettings）。
Select 一种编程语言（例如 TypeScript）。

如果设置菜单打开（自 1.66.0）：
4. 按→将光标置于语言筛选器的右侧（例如@lang:typescript）。
5. 键入 Tab Size 并在文本框中输入您的首选值。
如果settings.json文件打开：
4. 添加此代码：
```
"[typescript]": {
    "editor.tabSize": 2
}
```

See also: VS Code Docs

Answer 3

除了 Elliot-J 的回答之外，您可能还想将 editor.detectIndentation 设置为 false。

如果

VSCode 检测到文件具有不同的制表符或空格缩进模式，它将覆盖每个文件的 editor.tabSize 和 editor.insertSpaces 设置。如果您将现有文件添加到您的项目，或者如果您使用 Angular Cli 等代码生成器添加文件，您可以运行解决此问题。上面的设置阻止了 VSCode 这样做。

Answer 4

在我的例子中，“EditorConfig for VS Code”扩展覆盖了 VSCode 设置。如果你安装了它，然后检查项目根文件夹中的 .editorconfig 文件。

这是一个示例配置。 "indent_size" 设置制表符的空格数。

# editorconfig.org
root = true

[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false

Answer 5

代码格式化快捷方式：

VSCode 在 Windows - Shift + Alt + F

VSCode 在 MacOS 上 - Shift + Option + F

VSCode 在 Ubuntu - Ctrl + Shift + I

如果需要，您还可以使用偏好设置自定义此快捷方式。

用键盘选择列 Ctrl + Shift + Alt + 箭头

Answer 6

我想将现有 HTML 文件的缩进从 4 个空格更改为 2 个空格。

我点击了状态栏中的'Spaces: 4'按钮，在接下来的对话框中将它们改为两个。

我使用 'vim' 扩展名。我不知道如何在没有 vim

的情况下重新缩进

为了重新缩进我当前的文件，我使用了这个：

gg

=

G

Answer 7

补充：是的，您可以使用右下角的 UI 来配置 space 设置。但是，如果您有未格式化为新间距的现有代码，则可以右键单击文件中的任意位置，然后单击 Format Document。花了我一段时间才弄明白，直到我偶然发现 this issue.

Format Document menu

Answer 8

问题：接受的答案实际上并没有修复当前文档中的缩进。

解决方案：运行 Format Document 根据当前（新）设置重新处理文档。

问题：我项目中的 HTML 文档是 "Django HTML" 类型而不是 "HTML" 类型，并且没有可用的格式化程序。

解决方案：将它们切换为语法 "HTML"，格式化它们，然后切换回 "Django HTML."

问题：HTML 格式化程序不知道如何处理 Django 模板标签，并且撤消了我精心应用的大部分嵌套。

解决方案：安装 Indent 4-2 扩展，它严格执行缩进，而不考虑当前的语言语法（在这种情况下这是我想要的）。

Answer 9

要将所有现有文件和新文件设置为 space 标识为 2，只需将其放入您的 settingns.json（在 json 的根目录中）：

"[typescript]": {
        "editor.defaultFormatter": "vscode.typescript-language-features",
        "editor.tabSize": 2,
        "editor.insertSpaces": true,
        "editor.detectIndentation":false
 }

您可以添加配置的语言类型：

"[javascript]": {
    "editor.tabSize": 2,
    "editor.insertSpaces": true,
    "editor.detectIndentation":false
}

Answer 10

为那些用谷歌搜索“在 VS Code 中更改缩进”的人提供了带图片的简化说明

第 1 步：单击首选项 > 设置

第 2 步：您正在寻找的设置是“检测缩进”，开始输入它。单击“编辑器：制表符大小”

第 3 步：向下滚动到“编辑器：标签大小”并输入 2（或您需要的任何内容）。

自动保存更改

我的更改示例

Answer 11

您可以在全局 User 级别或 Workspace 级别更改此设置。

打开设置：使用快捷键 Ctrl , 或点击 File > Preferences > Settings如下图。

然后，进行以下 2 项更改：（在搜索栏中输入 tabSize）

取消选中 Detect Indentation
将制表符大小更改为 2/4（尽管我强烈认为 2 对 JS 来说是正确的:)）

Answer 12

如何在 VS Code 中将所有文件中的 4 个空格缩进变为 2 个空格

打开文件搜索
开启正则表达式
在搜索字段中输入：( {2})(?: {2})(\b|(?!=[,'";\.:\*\\/\{\}\[\]\(\)]))
在替换字段中输入：</code></li> </ul> 如何在 VS Code 中将所有文件中的 2 个空格缩进变为 4 个空格 <ul> <li>打开文件搜索</li> <li>开启正则表达式</li> <li>在搜索字段中输入：<code>( {2})(\b|(?!=[,'";\.:\*\\/{\}\[\]\(\)]))
在替换字段中输入：</code></li> </ul> 注意：您必须先打开 PERL 正则表达式。这是如何： <ul> <li>打开设置并转到 JSON 文件</li> <li>将以下内容添加到 JSON 文件 <code>"search.usePCRE2": true

希望有人看到。

Answer 13

自动取消意图的问题是由于 VSCode 的设置中的复选框处于活动状态引起的。请按照以下步骤操作：

转到首选项
转到设置
搜索'editor:trim auto whitespace'
取消勾选方框

Answer 14

在首选项中设置缩进并不总是解决方案。大多数时候缩进是正确的，除非你碰巧从其他来源复制了一些代码，或者你的同事为你做了一些东西并且有不同的设置。然后你想快速将缩进从 2 转换为 4 或相反。

That's what this vscode extension is doing for you

Answer 15

第 1 步：在 vscode

中打开 settings.json

第 2 步：为编程语言添加如下行（示例如下）

打字稿和javascript

"editor.detectIndentation": false,
"[typescript]": {
        "editor.defaultFormatter": "vscode.typescript-language-features",
        "editor.tabSize": 2,
        "editor.insertSpaces": true,
        "editor.detectIndentation":false
 },
"[javascript]": {
    "editor.tabSize": 2,
    "editor.insertSpaces": true,
    "editor.detectIndentation":false
}

Answer 16

对我来说是 docs-markdown andDocs Authoring Pack。微软的许多模块又互相搞乱了！禁用了扩展，现在可以再次使用

Answer 17

以下搜索和替换正则表达式将现有文件中每个缩进级别的 space 数量从 4 更改为 2。它相对容易理解，可靠，并且不需要安装任何东西。

说明

按 CtrlH（或在 macOS 上按 ⌥⌘F）。
通过单击搜索弹出窗口中的 .* 按钮或按 Alt 确保正则表达式匹配已打开R（或 ⌥⌘R 在 macOS 上）。
在查找字段中，输入^(?:( ) )?(?:( ) )?(?:( ) )?(?:( ) )?(?:( ) )?(?:( ) )?(?:( ) )?(?:( ) )?(?:( ) )?
在替换字段中，输入</code></li> <li>最后按<kbd>Ctrl</kbd><kbd>Enter</kbd>（或<kbd>⌘Enter</kbd> on macOS）申请当前文件。</li> </ul> 您也可以在左侧的“搜索”窗格中使用它来对项目中的所有文件执行此操作。但是，请注意每个文件只能运行一次。它会弄乱已经使用 2 spaces. 的文件的缩进 <hr /> <h2>额外学分：它是如何工作的</h2> 正则表达式的工作方式是在每行的开头 <code>^ ... 一次匹配四个 space 的组 (?: ... )，只捕获 ( ... )前两个 space。每个缩进级别都是可选的 ... ?，因此它适用于重复模式和每行中的缩进级别。然后它只用捕获的 spaces </code>、<code>、... 替换整个模式，有效地用两个 space 替换每四个 space 缩进级别]s.

此模式最多只能使用 9 个缩进级别（我不确定 </code> 是否可行，但如果可行，则可以无限期扩展）。 <h2>额外加分：扩展</h2> 您可以调整模式以将文件中每个缩进级别的 space 数量从任何 原始 数字减少到另一个较低的 目标个。 将 目标 个 space 放在括号内。然后，将剩余的原始个space放在外括号中，所以模式中space的总数就是原文. 例如，如果您想将缩进级别从 6 更改为 4，请根据需要重复此搜索模式多次： <code>^(?:( ) )? 或 ^(?:( {4}) {2})?

并在替换模式中使用相同数量的</code>、<code>。

Answer 18

首先，检查您是否安装了“EditorConfig for VS Code”。它覆盖了我的编辑器设置。我花了一整天的时间来纠正这个问题。

在项目中找到 .editorconfig 文件并在那里更改它就可以了。

如何更改 Visual Studio 代码中的缩进？

How to change indentation in Visual Studio Code?

formatting

visual-studio-code

编辑 1

说明