Як відформатувати код у коді Visual Studio (VSCode)

Що таке еквівалент Ctrl+ K+ Fта Ctrl+ K+ Dу Windows у Visual Studio для форматування чи «прикраси» коду в редакторі коду Visual Studio?

Форматування коду доступне у коді Visual Studio за допомогою таких ярликів:

• У Windows Shift+ Alt+F
• На Mac Shift+ Option+F
• У Linux Ctrl+ Shift+I

Крім того, ви можете знайти ярлик, як і інші ярлики, через "Палітру команд", надану в редакторі Ctrl+ Shift+ P(або Command+ Shift+ Pна Mac), а потім здійснити пошук формату документа .

Ярлик для форматування коду:

Код Visual Studio у Windows - Shift+ Alt+F

Код Visual Studio на MacOS - Shift+ Option+F

Код візуальної студії в Ubuntu - 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. Перевірте моє оновлення.

Ви можете додати введення файлів у меню Файл → Налаштування → Комбінації клавіш.

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

Або Visual Studio на зразок:

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

1. Клацніть файл правою кнопкою миші
2. Виберіть у меню Формат документа :
   • Windows: Alt Shift F
   • Linux: Alt Shift I
   • macOS: ⌥ ⇧ F

Права комбінація клавіш - Shift+ Alt+ F.

Для Fedora

1. Клацніть File-> Preferences-> Keyboard shortcuts.
2. У розділі Default Keyboard Shortcutsзнайдіть ( Ctrl+ F) для editor.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 :

Відповідно до версії Visual Code, 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.

В Linux це Ctrl+ Shift+I .

У Windows це Alt+ Shift+F . Тестується за допомогою HTML / CSS / JavaScript та Visual Studio Code 1.18.0.

Для інших мов вам може знадобитися встановити певний мовний пакет.

Visual Studio Code 1.6.1 підтримує " Формат у режимі збереження ", який автоматично підбирає відповідні встановлені розширення форматера та форматує весь документ на кожному збереженні.

Увімкніть "Формат у режимі збереження", встановивши

"editor.formatOnSave": true

І є доступні комбінації клавіш (Visual Studio Code 1.7 і вище):

Відформатуйте весь документ : Shift+ Alt+F

Лише підбір формату : Ctrl+ K, Ctrl+F

Для Ubuntu це Ctrl+ Shift+ I.

Просто натисніть на текст правою кнопкою миші та виберіть "Форматувати код".

Visual Studio Code використовується js-beautifyвнутрішньо, але він не має можливості змінювати стиль, який ви хочете використовувати. Розширення "прикрасити" дозволяє додавати налаштування.

Файл меню → Налаштування → Установки

"editor.formatOnType": true

Коли ви введете крапку з комою, вона буде відформатована.

Крім того, ви також можете використовувати "editor.formatOnSave": true.

Shift+ Alt+ Fвиконає роботу добре в 1.17.2 і вище.

Чомусь Alt+ Shift+ Fне працював для мене на Mac Visual Studio Code 1.3.1, і фактично команда "Форматувати документ" взагалі не працювала. Але команда Форматтер працювала дуже добре.

Таким чином, ви можете використовувати Command+ Shift+ Pі ввести Formatter або зробити власний ярлик у меню Файл → Налаштування → Комбінації клавіш → Command+ K Command+, Sа потім введіть Форматтер і додайте ярлик.

Дивіться приклад:

Форматування коду у Visual Studio.

Я спробував форматувати в Windows 8.

Просто слідкуйте за скріншотами нижче.

1. Клацніть на Перегляд у верхній панелі меню, а потім натисніть на Палітра команд.

   

2. Тоді з'явиться текстове поле, де нам потрібно ввести Формат

   Shift+ Alt+F

   

У коді Visual Studio Shift+ Alt+ Fробить те, що робить Ctrl+ K+ Dу Visual Studio.

Ярлик формату в C # не працював для мене, поки я не встановив Mono для Mac OS X, DNVM і DNX .

Перш ніж я встановив Mono, ярлик автоматичного форматування ( Shift+ Alt+ F) працював лише для .jsonфайлів.

На Mac Shift+ Alt+ Fпрацює для мене.

Ви завжди можете перевірити ключові прив’язки в меню:

Файл меню → Налаштування → Комбінації клавіш і фільтруйте за ключовим словом "формат".

Під час зміни поведінки за замовчуванням для Visual Studio Code потрібне розширення, ви можете змінити поведінку за замовчуванням у робочій області або на рівні користувача. Він працює для більшості підтримуваних мов (я можу гарантувати HTML, JavaScript та C #).

Рівень робочої області

Переваги

• Не вимагає продовження
• Можна поділитися між командами

Результати

• .vscode/settings.json створюється в кореневій папці проекту

Як?

1. Перейдіть до: Файл меню → Налаштування → Налаштування робочої області

2. Додайте та збережіть "editor.formatOnType": trueу settings.json (який переосмислює поведінку за замовчуванням для проекту, над яким ви працюєте, створивши файл .vscode / settings.json).

   

Рівень середовища користувача

Переваги

• Не вимагає продовження
• Середовище особистого розвитку налаштовує, щоб керувати ними всім (налаштування :))

Результати

• Користувач settings.jsonмодифікований (див. Розташування за операційною системою нижче)

Як?

1. Перейдіть у меню Файл → Налаштування → Налаштування користувача

2. Додайте або змініть значення "editor.formatOnType": falseдо "editor.formatOnType": trueв налаштуваннях користувача.json

Ваш користувач 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 вашого проекту.

Більш детальну інформацію можна знайти тут .

За замовчуванням цей ключ не працював для мене в документах HTML, CSS та JavaScript.

Після пошуку я знайшов популярний плагін JS-CSS-HTML Formatter із 133,796 встановлень .

Після установки просто перезавантажте вікна та натисніть Ctrl+ Shift+ F, і воно спрацювало!

Виберіть текст, клацніть правою кнопкою миші на виділенні та виберіть опцію "палітра команд":

Відкриється нове вікно. Знайдіть "формат" і виберіть варіант, який має форматування відповідно до вимоги.

Просто встановіть Visual Studio Keymap від Microsoft. Проблема вирішена. : с

У Mac використовуйте ⌘+, Kа потім ⌘+ F.

Для тих, хто хоче налаштувати файли JavaScript для форматування, ви можете використовувати будь-яке розширення у JSfilesвластивості. Те саме стосується HTML.

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

Це дозволить прикрасити при збереженні для TypeScript, і ви можете додати в XML параметр HTML.

Якщо ви хочете налаштувати стиль формату-документа, вам слід використовувати Розширити розширення.

Перегляньте цей знімок екрана:

Ви повинні спочатку встановити відповідний плагін (тобто XML, C # тощо).

Форматування не стане доступним, поки ви не встановите відповідний плагін і не збережете файл із відповідним розширенням.

Найпростіший спосіб, який я використовую в коді Visual Studio (Ubuntu), це:

Виберіть текст, який ви хочете відформатувати за допомогою миші.

Клацніть правою кнопкою миші та виберіть "Вибір формату" .

Не цей. Використовуй це:

Файл меню → Налаштування → Налаштування робочої області , "editor.formatOnType" : вірно

Використовувати розширення ...

Дозволяє автоматичне форматування коду під час збереження файлу.

Запустіть Visual Studio Code та Quick Open ( Ctrl+ P), вставте наступну команду та натисніть Enter.

ext встановити формат-на-збереження

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

Код Visual Studio на Linux:

Ctrl+ [до невідповідного блоку коду та

Ctrl+ ]зробити масовий відступ