Visual Studioコード（VSCode）でコードをフォーマットする方法

Question

同等のものは何ですか Ctrl + K + F そして Ctrl + K + D フォーマット、またはVisual Studioのコードエディタでコードを "美化"するためのVisual StudioのWindows上で？

Answer 1

コードの書式設定は、次のショートカットからVisual Studio Codeで利用できます。

• Windowsの場合 Shift + Alt + F
• Macの場合 Shift + Option + F
• Ubuntuについて Ctrl + Shift + I

代わりに、あなたは他のショートカットと同様にショートカットをエディタで提供される検索機能を通して見つけることができます。 Ctrl +Shift+ P （または Command + Shift + P Macの場合は、フォーマットのドキュメントを検索します。

Answer 2

コードフォーマットのショートカット：

Windows上のVisual Studioコード - Shift + Alt + F

MacOS上のVisual Studioコード - Shift + Option + F

UbuntuのVisual Studioコード - Ctrl + Shift + I

必要に応じて、環境設定を使用してこのショートカットをカスタマイズすることもできます。

ファイルを保存している間のコードフォーマット：

Visual Studio Codeを使用すると、ユーザーはデフォルト設定をカスタマイズできます。

保存中にコンテンツを自動フォーマットしたい場合は、Visual Studio Codeのワークスペース設定に以下のコードスニペットを追加してください。

メニューファイル→設定→ワークスペース設定

{
    // 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ファイルを自動フォーマットできます。私のアップデートをチェックしてください。

Answer 3

あなたはメニューにキーバインドを追加することができます ファイル → 設定 → キーボード ショートカット。

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

または Visual Studio のように：

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

Answer 4

正しいキーの組み合わせは Shift + Alt + F。

Answer 5

1. ファイルを右クリック
2. フォーマット文書を選択（Alt + Shift + Fメニューボックスから）.

Answer 6

また、今日の時点でこれらの言語でフォーマットが利用可能であることにも注意してください。

• XML （彼らは それを削除しました 、バグが多すぎます）
• HTML
• JSON
• JavaScript
• TypeScript
• C＃

Answer 7

Linuxではそれは Ctrl + Shift + I。

Windowsでは Alt + Shift + F。 HTML/CSS/JavaScriptとVisual Studio Code 1.18.0でテスト済み。

他の言語の場合は、特定の言語パッケージをインストールする必要があります。

Answer 8

Fedora用

1. File - > Preferences - > Keyboard shortcutsをクリックします。
2. Default Keyboard Shortcutsの下で、（Ctrl + Feditor.action.formatの場合.

鉱山は"key": "ctrl+shift+i"を読みました

あなたもそれを変えることができます。どうやればよいのか、あるいは少し上にスクロールするのが面倒な場合は、 この回答 を参照してください。

---

あなたは "設定 - >キーボードショートカット"でキーバインドを追加することができます。

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

またはVisual Studioのように：

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

---

ご注意ください： cmd キーはMac専用です。 WindowsとFedora（Windowsキーボード）の場合 Ctrl

---

EDIT：

ビジュアルコードのバージョン1.28.2に従って、これは私が見つけたものです。

editor.action.formatはもう存在しません。現在はeditor.action.formatDocumentとeditor.action.formatSelectionに置き換えられています。

既存のショートカットを表示するには、検索ボックスにeditor.action.formatと入力します。

キーの組み合わせを変更するには、次の手順に従います。

1. editor.action.formatDocumentまたはeditor.action.formatSelectionをクリック
2. ペンのようなアイコンが左側に表示されます - それをクリックします。
3. ポップアップが表示されます。目的のキーの組み合わせを押して、Enterキーを押します。

Answer 9

Visual Studioのコード1.6.1「保存時のフォーマット」をサポートしています。保存ごとに文書化します。

設定で "保存時にフォーマット"を有効にする

"editor.formatOnSave": true

そして利用可能なキーボードショートカットがあります（Visual Studioコード1.7以上）：

文書全体をフォーマットする： Shift + Alt + F

フォーマット選択のみ： Ctrl + K、 Ctrl + F

Answer 10

Ubuntuでは Ctrl + Shift + I。

Answer 11

テキストを右クリックして[フォーマットコード]を選択するだけです。

Visual Studio Codeは内部でjs-beautifyを使用しますが、使用したいスタイルを変更する機能はありません。拡張子 "beautify"を使うと設定を追加できます。

Answer 12

何らかの理由で Alt + Shift + F 私はMac Visual Studio Code 1.3.1では動作しませんでした、そして実際には "Format Document"コマンドはまったく動作しませんでした。しかし、commandFormatterはとてもうまくいきました。

だからあなたは使用することができます Command + Shift + P そして、Formatterとタイプするか、メニューに独自のショートカットを作成しますFile→設定→キーボードショートカット→ Command + KCommand + S 次に、Formatterと入力してショートカットを追加します。

例を見てください。

Answer 13

Shift + Alt + F 1.17.2以降ではうまく機能します。

Answer 14

C＃のフォーマットのショートカットは、Mac OS Xの場合は Mono 、 DNVM および DNX をインストールするまで機能しませんでした。

Monoをインストールする前は、自動フォーマットのショートカット（Shift + Alt + F）.jsonファイルに対してのみ機能しました。

Answer 15

Visual Studioのコードでは、 Shift+Alt+F 何をしている Ctrl+K+D Visual Studioでやっています。

Answer 16

Macでは、 Shift + Alt + F 私のために働きます。

メニューでいつでもキー割り当てを確認できます。

メニューファイル→設定→キーボードショートカットそしてキーワード 'format'でフィルタリングします。

Answer 17

Visual Studioのフォーマットコード。

Windows 8でフォーマットしようとしました。

以下のスクリーンショットに従ってください。

1. 上部のメニューバーの[表示]をクリックし、次に[コマンドパレット]をクリックします。

   

2. テキストボックスが必要な場所に表示されますフォーマット

   Shift + Alt + F

   

Answer 18

Visual Studio Codeのデフォルトの動作を変更するには拡張子が必要ですが、ワークスペースまたはユーザーレベルでデフォルトの動作をオーバーライドすることができます。サポートされているほとんどの言語で動作します（HTML、JavaScript、およびC＃を保証できます）。

ワークスペースレベル

メリット

• 拡張子を必要としません
• チーム間で共有できます

結果

• プロジェクトのルートフォルダに.vscode/settings.jsonが作成されます。

どうする？

1. メニューファイル→設定→ワークスペースの設定

2. "editor.formatOnType": trueをsettings.jsonに追加して保存します（これは、作業するプロジェクトのデフォルトの動作（.vscode/settings.jsonファイルを作成することによってオーバーライドされます））。

   

ユーザー環境レベル

メリット

• 延長は不要
• すべてを統制するための個人用開発環境の調整（設定:)

結果

• ユーザーのsettings.jsonが変更されました（下記のオペレーティングシステム別の場所を参照）

どうする？

1. Menu ファイル→設定→ユーザー設定

2. ユーザーsettings.jsonで"editor.formatOnType": falseの値を"editor.formatOnType": trueに追加または変更します。

Visual Studio Codeユーザーのsettings.jsonの場所は次のとおりです。

プラットフォームに応じた設定ファイルの場所、ユーザー設定ファイルは次の場所にあります。

• Windows：%APPDATA%\Code\User\settings.json
• マック：$HOME/Library/Application Support/Code/User/settings.json
• Linux：$HOME/.config/Code/User/settings.jsonワークスペース設定ファイルは、プロジェクトの.vscodeフォルダーの下にあります。

詳細は here をご覧ください。

Answer 19

デフォルトでは、このキーはHTML、CSS、およびJavaScript文書では機能しませんでした。

検索した後、私は人気のあるプラグイン JS-CSS-HTML Formatter with133,796をインストールしました。

インストールが完了したら、ウィンドウをリロードしてヒットしてください。 Ctrl + Shift + F、そしてそれはうまくいった！

Answer 20

メニュー ファイル → 設定 → 設定

"editor.formatOnType": true

セミコロンを入力すると、フォーマットされます。

Answer 21

テキストを選択し、選択部分を右クリックして、オプション "コマンドパレット"を選択します。

新しいウィンドウが開きます。 「フォーマット」を検索し、要件に従ってフォーマットがあるオプションを選択します。

Answer 22

Macでは、 ⌘+K その後 ⌘+F。

Answer 23

Microsoftの Visual Studio Keymap をインストールするだけです。問題が解決しました。 ：P

Answer 24

Format-documentのスタイルをカスタマイズしたい場合は、 Beautify extensionを使用してください。

このスクリーンショットを参照してください。

Answer 25

これじゃない。これを使って：

メニュー ファイル → 設定 → ワークスペース設定 、 "editor.formatOnType" ： true

Answer 26

あなたは最初に適切なプラグインをインストールしなければなりません（すなわち、XML、C＃など）。

適切なプラグインをインストールし、適切な拡張子を付けてファイルを保存するまで、フォーマットは利用できません。

Answer 27

私がVisual Studio Code（Ubuntu）で使用する最も簡単な方法は、次のとおりです。

マウスでフォーマットしたいテキストを選択します。

右クリックして "Format selection" を選択します。

Answer 28

どのJavaScriptファイルをフォーマットするかをカスタマイズしたい場合は、JSfilesプロパティに any 拡張子を使用できます。同じことがHTMLにも当てはまります。

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

これによりTypeScriptの保存時の美しさが有効になり、XMLをHTMLオプションに追加できます。

Answer 29

Linux上のVisual Studioコード：

Ctrl + [ 思わずコードブロックに

Ctrl + ] 大量の字下げをする

Answer 30

拡張子を使用...

ファイルを保存するときにコードの自動フォーマットを有効にします。

Visual Studioのコードを起動し、クイックオープン（Ctrl + P）、次のコマンドを貼り付けて、 Enter。

extインストール保存形式

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