Visual Studio 代码 (VSCode) 中如何格式化代码?

How do you format code in Visual Studio Code (VSCode)?

Ctrl + K + F 和 [=14= 等价于什么]Ctrl + K + D on Windows in Visual Studio 进行格式化,或 "beautifying" Visual Studio 代码编辑器中的代码?

代码格式化在Visual Studio代码中可用,通过以下快捷方式:

  • On Windows Shift + Alt + F
  • On Mac Shift + Option + F
  • On Linux Ctrl + Shift + I

或者,您可以通过 Ctrl +Shift[ 编辑器中提供的 'Command Palette' 找到快捷方式以及其他快捷方式=68=]+ P(或Command + Shift + P on Mac), 然后搜索 格式文档.

对于未保存的片段

  1. 打开命令面板(Win: F1Ctrl+Shift+P)

  2. 找到“更改语言模式”

  3. Select 语言 例如json。现在应该突出显示语法。

  4. 格式化文档(例如打开命令面板 -> “格式化文档”)

取消格式化

  1. Select 文本
  2. 命令面板 -> 加入行

'显示图片'

您可以在菜单 文件首选项键盘 快捷方式中添加快捷键。

{ "key": "cmd+k cmd+d", "command": "editor.action.formatDocument" }

Visual Studio喜欢:

{ "key": "ctrl+k ctrl+d", "command": "editor.action.formatDocument" }

在Visual Studio代码中,Shift+Alt+F在做Ctrl+K+D 在 Visual Studio.

中做什么

右边的组合键是Shift + Alt + F.

在Linux上是Ctrl + Shift + I.

在Windows上是A​​lt + Shift + F。使用 HTML/CSS/JavaScript 和 Visual Studio 代码 1.18.0.

进行测试

对于其他语言,您可能需要安装特定的语言包。

在我安装 Mono for Mac OS X, and 之前,C# 中的格式快捷方式对我不起作用。

在我安装 Mono 之前,自动格式化快捷方式 (Shift + A​​lt + F) 仅适用于 .json 个文件。

在 Ubuntu 上是 Ctrl + Shift + I.

代码格式化快捷方式:

Visual Studio Windows 上的代码 - Shift + Alt + F

Visual Studio MacOS 上的代码 - Shift + Option + F

Visual Studio Ubuntu 上的代码 - Ctrl + Shift + I

如果需要,您还可以使用首选项设置自定义此快捷方式。

保存文件时格式化代码:

Visual Studio代码允许用户自定义默认设置。

如果您想在保存时自动格式化您的内容,请在 Visual Studio 代码的工作 space 设置中添加以下代码片段。

菜单文件首选项工作space设置

{
    // Controls if the editor should automatically format the line after typing
    "beautify.onSave": true,

    "editor.formatOnSave": true,

    // You can auto format any files based on the file extensions type.
    "beautify.JSfiles": [
        "js",
        "json",
        "jsbeautifyrc",
        "jshintrc",
        "ts"
    ]
}

注意:现在您可以自动格式化 TypeScript 文件。查看我的更新。

不是这个。使用这个:

菜单文件首选项工作区设置, "editor.formatOnType":

对于 Fedora

  1. 单击 File -> Preferences -> Keyboard shortcuts
  2. Default Keyboard Shortcuts 下,搜索 (Ctrl + F) editor.action.format.

我的阅读 "key": "ctrl+shift+i"

你也可以改变它。请参阅 了解如何...或者如果您觉得向上滚动有点懒惰:


You can add a keybinding in "Preferences->Keyboard shortcuts"

{ "key": "cmd+k cmd+d", "command": "editor.action.format" }

Or Visual Studio like:

{ "key": "ctrl+k ctrl+d", "command": "editor.action.format" }


请注意:cmd 键仅适用于 Mac。对于 Windows 和 Fedora(Windows 键盘)使用 Ctrl


编辑:

根据 Visual Code 版本 1.28.2 这是我发现的。

editor.action.format 已不存在。它现在已被 editor.action.formatDocumenteditor.action.formatSelection.

取代

在搜索框中键入 editor.action.format 以查看现有的快捷方式。

要更改组合键,请按照下列步骤操作:

  1. 单击 editor.action.formatDocumenteditor.action.formatSelection
  2. 左侧出现一个笔状图标 - 单击它。
  3. 出现一个弹出窗口。按所需的组合键并按回车键。

使用扩展...

保存文件时启用代码的自动格式设置。

启动Visual Studio代码和快速打开 (Ctrl + P) , 粘贴以下命令,然后按 Enter.

ext install format-on-save

https://marketplace.visualstudio.com/items?itemName=gyuha.format-on-save

对于那些想要自定义要格式化的 JavaScript 文件的用户,您可以在 JSfiles 属性 上使用 any 扩展名。同样适用于 HTML.

{
    "beautify.onSave": true,
    "beautify.JSfiles": ["js", "json", "jsbeautifyrc", "jshintrc", "ts"],
    "beautify.HTMLfiles": ["htm", "html"]
}

这将为 TypeScript 启用保存时美化,您可以将 XML 添加到 HTML 选项。

虽然更改 Visual Studio 代码的默认行为需要扩展,但您可以覆盖工作区或用户级别的默认行为。它适用于大多数支持的语言(我可以保证 HTML、JavaScript 和 C#)。

工作区级别

好处

  • 不需要延期
  • 可以在团队之间共享

结果

  • .vscode/settings.json在项目根文件夹中创建

怎么做?

  1. 转到:菜单 文件首选项工作区设置

  2. 添加并保存 "editor.formatOnType": true 到 settings.json(通过创建 .vscode/settings.json 文件覆盖您所处理项目的默认行为).

用户环境级别

好处

  • 不需要扩展
  • 个人开发环境 tweeking to rule them all (settings:))

结果

  • 用户的 settings.json 已修改(请参阅下面操作系统的位置)

怎么做?

  1. 转到:菜单文件首选项用户设置

  2. 在用户settings.json

  3. 中将"editor.formatOnType": false的值添加或更改为"editor.formatOnType": true

您的Visual Studio代码用户的settings.json位置是:

设置文件位置取决于您的平台,用户设置文件位于此处:

  • Windows: %APPDATA%\Code\User\settings.json
  • Mac: $HOME/Library/Application Support/Code/User/settings.json
  • Linux: $HOME/.config/Code/User/settings.json 工作区设置文件位于项目的 .vscode 文件夹下。

可以找到更多详细信息 here

您必须先安装合适的插件(即 XML、C# 等)。

在安装相关插件并使用适当的扩展名保存文件之前,无法进行格式化。

Visual Studio Linux 上的代码:

Ctrl + [ 取消缩进代码块和

Ctrl + ] 批量缩进

只需右键单击文本,然后 select "Format code"。

Visual Studio 代码在内部使用 js-beautify,但它无法修改您希望使用的样式。扩展 "beautify" 允许您添加设置。

Visual Studio 代码 1.6.1 支持“Format On Save”,它将自动获取相关已安装的格式化程序扩展和每次保存时格式化整个文档。

通过设置

启用 "Format On Save"
"editor.formatOnSave": true

并且有可用的键盘快捷键(Visual Studio代码1.7及以上):

格式化整个文档Shift + Alt + F

仅格式选择: Ctrl + K, Ctrl + F

默认情况下,此键在 HTML、CSS 和 JavaScript 文档上对我不起作用。

经过搜索,我找到了 JS-CSS-HTML Formatter 的流行插件 133,796 次安装

安装后,只需重新加载 windows 并按 Ctrl + Shift + F,成功了!

只需安装 Microsoft 的 Visual Studio Keymap(Visual Studio Keymap for Visual Studio Code)。问题解决了。 :p

我在 Visual Studio 代码 (Ubuntu) 中使用的最简单的方法是:

Select 您想用鼠标设置格式的文本。

右击选择"Format selection".

在Mac中,使用+K然后+ F.

出于某种原因 Alt + Shift + F 对我不起作用Mac Visual Studio 代码 1.3.1,实际上命令 "Format Document" 根本不起作用。但是命令 Formatter 工作得很好。

所以你可以使用Command + Shift + P 然后输入Formatter 或在菜单 FilePreferencesKeyboard Shortcuts 中创建自己的快捷方式→ Command + K Command + S 然后键入 Formatter 并添加您的快捷方式。

看例子:

Shift + Alt + F 在 1.17.2 和以上。

如果你想自定义format-document的样式,你应该使用Beautify扩展。

参考这个截图:

On Mac, Shift + Alt + F 对我有用.

您随时可以在菜单中查看按键绑定:

菜单文件首选项键盘快捷键并按关键字过滤'format'.

Select文本,右击select离子,select选项"command palette":

一个新的 window 打开。根据要求搜索 "format" 和 select 具有格式的选项。

菜单文件首选项设置

"editor.formatOnType": true

当你输入分号时,它会被格式化。

或者,您也可以使用 "editor.formatOnSave": true

Visual Studio 中的格式化代码。

我已经尝试格式化 Windows 8.

只需按照下面的屏幕截图操作即可。

  1. 单击顶部菜单栏上的“查看”,然后单击“命令面板”。

  2. 然后会出现一个文本框,我们需要输入 Format

    Shift + Alt + F

  1. 右键单击文件内容区域(文本)中的某处
  2. Select 格式化文档 从菜单:
    • Windows: Alt+Shift+F
    • Linux: Alt+Shift+I
    • macOS: ++F