Как структурировать код в Visual Studio Code?
Автоматическое форматирование кода в Visual Studio Code выполняется следующими комбинациями:
- Windows: Shift + Alt + F
- Mac: Shift ⇧ + Option ⌥ + F
- Ubuntu: Ctrl + Shift + I
Отслеживать
7,856 13 13 золотых знаков 27 27 серебряных знаков 57 57 бронзовых знаков
ответ дан 5 фев 2019 в 14:27
26.7k 7 7 золотых знаков 32 32 серебряных знака 49 49 бронзовых знаков
Огромное спасибо , наконец то не надо будет в онлайн форматере работать
6 фев 2019 в 6:58
В дополнении к ответу от @Эникейщик
В настройках можно установить форматирование при сохранении
Что искать в настройках
- Или Editor: Format On Save в графическом интерфейсе
- Или editor.formatOnSave в settings.json
Предупреждение:
Влючайте данную опцию, если вы точно уверены в своих настройках и используемых форматтерах. При сохранении файлы будут изменены. И это может давать побочные эффекты также для git-веток.
Диалоговое окно «Параметры»: форматирование стиля > кода C# > в текстовом редакторе >
Используйте страницу параметров Форматирование и ее вложенные страницы (Отступ, Новые строки, Интервал и Перенос) для задания параметров форматирования кода в редакторе кода.
Чтобы получить доступ к странице параметров, в строке меню выберите Сервис>Параметры. В диалоговом окне Параметры выберите Текстовый редактор>C#>Стиль кода>Форматирование.
В нижней части каждой вложенной страницы Отступ, Новые строки, Интервалы и Перенос отображается окно предварительного просмотра, в котором можно увидеть действие каждого параметра. Чтобы использовать окно предварительного просмотра, выберите параметр форматирования. В окне предварительного просмотра отображается пример выбранного параметра. При изменении параметра с помощью переключателя или флажка содержимое окна предварительного просмотра меняется, отображая эффект применения новой настройки.
Страница «Форматирование» > «Общие»
Общие параметры
Эти параметры определяют, когда редактор кода применяет параметры форматирования к коду.
| Label | Description |
|---|---|
| Автоматически форматировать при вводе | Если параметр не выбран, параметры форматирования оператора при вводе запятой «;» и форматирования блока при вводе фигурной скобки «>» отключены. |
| Автоматически форматировать оператор при вводе «;» | Если установлен этот флажок, форматирование операторов выполняется по завершении в соответствии с выбранными для редактора параметрами. |
| Автоматически форматировать блок при вводе «>» | Если установлен этот флажок, форматирование блоков кода выполняется в соответствии с выбранными для редактора параметрами, как только завершается блок кода. |
| Автоматически форматировать при возврате | Если параметр выбран, при нажатии клавиши ВВОД текст форматируется в соответствии с параметрами форматирования, выбранными для редактора. |
| Автоматически форматировать при вставке | Если этот параметр выбран, форматирование текста, вставляемого в редакторе, выполняется в соответствии с выбранными для редактора параметрами. |
Если ранее параметры стиля кода для файлов C# применялись с помощью команды Форматировать документ в Visual Studio 2017, теперь это можно сделать с использованием функции Очистка кода.
Страница «Отступ»
Параметры отступов на этой странице применяются при автоматическом форматировании кода. Например, при вставке кода в файл, когда выбран параметр Автоматически форматировать при вставке. (Параметр Автоматически форматировать при вставке находится в разделе Форматирование>Общие.)
Параметры отступа доступны также на странице параметров Текстовый редактор>C#>Вкладки. Они определяют только место, в которое редактор кода помещает курсор при нажатии клавиши ВВОД в конце строки.
Страница «Новые строки»
Воспользуйтесь параметром новых строк на этой странице, чтобы управлять появлением элементов (скобок, ключевых слов или выражений) на новых строках в редакторе кода.
Файл .editorconfig может переопределить параметры, заданные на этой странице. Дополнительные сведения см. в разделе Создание переносимых настраиваемых параметров редактора с EditorConfig.
См. также
Параметры стиля кода
Код стиля параметров каждого проекта можно определить с помощью EDITORCONFIG-файла; для всего кода в Visual Studio можно задать настройки на странице Параметры в текстовом редакторе. Для кода на C# можно также настроить Visual Studio, чтобы применять эти параметры стиля кода с помощью команд Очистка кода (Visual Studio 2019, Visual Studio 2022) и Форматировать документ (Visual Studio 2017).
Этот раздел относится к Visual Studio в Windows. Информацию о Visual Studio для Mac см. в статье Поведение редактора в Visual Studio для Mac.
Стили кода в EDITORCONFIG-файлах
Параметры стиля кода для .NET можно указать, добавив EDITORCONFIG-файл к проекту. EDITORCONFIG-файлы связаны с базой кода, а не с учетной записью персонализации Visual Studio. Параметры в EDITORCONFIG-файле имеют приоритет над параметрами, выбранными в диалоговом окне Параметры. Используйте файл EditorConfig, если вы хотите применить стили кода для всех участников к репозиторию или проекту.
Вы можете вручную отредактировать файл EditorConfig или автоматически создать его в зависимости от установленных в Visual Studio параметров стиля кода в диалоговом окне Параметры. Эта страница параметров доступна в текстовом редакторе> «Параметры> инструментов>» (C# или Basic)> «Стандартный» стиль>кода. Нажмите кнопку Создать EDITORCONFIG-файл из параметров, чтобы автоматически создать EDITORCONFIG-файл стиля кода на основе параметров, которые вы задали на этой странице Параметры.
Вы можете вручную отредактировать файл EditorConfig или автоматически создать его в зависимости от установленных в Visual Studio параметров стиля кода в диалоговом окне Параметры. Эта страница параметров доступна в текстовом редакторе> «Параметры>инструментов>» (C# или Visual Basic)> «Общий стиль>кода». Нажмите кнопку Создать EDITORCONFIG-файл из параметров, чтобы автоматически создать EDITORCONFIG-файл стиля кода на основе параметров, которые вы задали на этой странице Параметры.
Стили кода в диалоговом окне «Параметры»
Параметры стиля кода для проектов C# и Visual Basic можно задать, открыв диалоговое окно Параметры из меню Сервис. В диалоговом окне «Параметры» выберите текстовый редактор> [C# или Visual Basic] >«Общий стиль>кода».
Параметры стиля кода для проектов C# и Visual Basic можно задать, открыв диалоговое окно Параметры из меню Сервис. В диалоговом окне «Параметры» выберите текстовый редактор> [C# или Базовый]> Стиль>кода «Общие».
При выборе для каждого из элементов в списке выводится окно предварительного просмотра:
Параметры, заданные в этом окне, применяются к вашей учетной записи персонализации Visual Studio и не связаны с конкретным проектом или базой кода. Кроме того, они не применяются во время сборки, в том числе в сборках с непрерывной интеграцией (CI). Если вы хотите связать предпочтения к стилю кода со своим проектом и применяете стили во время сборки, укажите такие предпочтения в EDITORCONFIG-файле, связанном с проектом.
Предпочтения и степень серьезности
Для каждого параметра стиля кода на этой странице с помощью раскрывающихся списков в каждой строке можно задать значения для параметров Предпочтение и Серьезность. Для серьезности можно задать значения Только рефакторинг, Предложение, Предупреждение или Ошибка. Если вы хотите включить быстрые действия для стиля кода, убедитесь, что для параметра Серьезность задано значение, отличное от Только рефакторинг. Значок лампочки быстрого действия, лампочки ошибки или отвертки 
появляется при использовании непредпочтительным стилем, и вы можете выбрать параметр в списке быстрых действий, чтобы автоматически переписать код в предпочитаемый стиль.
Принудительное применение стиля кода в сборке
Начиная с Visual Studio 2019 версии 16.8, куда входит пакет SDK для .NET 5.0 RC2, можно применять соглашения о написании кода .NET в сборке для всех проектов .NET. Во время сборки нарушения стиля кода .NET будут отображаться в виде предупреждений или ошибок с префиксом IDE. Это позволяет строго применять единообразные стили кода в базе кода.
Применение стилей кода
Для файлов кода на C# в Visual Studio есть кнопка Очистка кода в нижней части редактора (сочетание клавиш: CTRL+K, CTRL+E) для применения стилей кода из EDITORCONFIG-файла или со страницы параметров стиля кода. Если EDITORCONFIG-файл существует в проекте, его параметры имеют приоритет.
Правила, настроенные с серьезностью Нет, не используются в ходе очистки кода, но могут применяться по отдельности через меню Быстрые действия и рефакторинг.
Во-первых, настройте стили кода, которые необходимо применять (в одном из двух профилей), используя диалоговое окно Настройка очистки кода. Чтобы открыть это диалоговое окно, щелкните стрелку рядом со значком метлы (очистка кода) и выберите команду Настроить очистку кода.
После настройки очистки кода вы можете щелкнуть значок метлы или нажать клавиши Ctrl+K, Ctrl+E, чтобы запустить очистку кода. Вы также можете выполнить очистку кода для всего проекта или решения сразу. Щелкните правой кнопкой мыши имя проекта или решения в обозревателе решений, выберите команду Анализ и очистка кода, а затем — Запустить очистку кода.
Для файлов кода на C# в Visual Studio есть кнопка Очистка кода в нижней части редактора (сочетание клавиш: CTRL+K, CTRL+E) для применения стилей кода из EDITORCONFIG-файла или со страницы параметров стиля кода. Если EDITORCONFIG-файл существует в проекте, его параметры имеют приоритет.
Правила, настроенные с серьезностью Нет, не используются в ходе очистки кода, но могут применяться по отдельности через меню Быстрые действия и рефакторинг.
Во-первых, настройте стили кода, которые необходимо применять (в одном из двух профилей), используя диалоговое окно Настройка очистки кода. Чтобы открыть это диалоговое окно, щелкните стрелку рядом со значком метлы (очистка кода) и выберите команду Настроить очистку кода.
После настройки очистки кода вы можете щелкнуть значок метлы или нажать клавиши Ctrl+K, Ctrl+E, чтобы запустить очистку кода. Вы также можете выполнить очистку кода для всего проекта или решения сразу. Щелкните правой кнопкой мыши имя проекта или решения в обозревателе решений, выберите команду Анализ и очистка кода, а затем — Запустить очистку кода.
Параметры очистки кода
Большинство параметров очистки кода сопоставляется с одним или несколькими стилями кода .NET, поддерживаемыми в editorconfig. Примеры, показывающие эффекты параметров, используйте ссылки в следующей таблице.
| Параметр | Параметр «Идентификатор правила» или «Стиль» |
|---|---|
| Удаление ненужных импортов или использования | IDE0005 |
| Применение параметров заголовка файла | file_header_template |
| Удалить неиспользуемые переменные | IDE0051 |
| Применение параметров создания объектов | visual_basic_style_prefer_simplified_object_creation |
| Применение настроек IsNot | visual_basic_style_prefer_isnot_expression |
| Добавление квалификации «это» или «Я» | IDE0003-IDE0009 |
| Добавить модификаторы доступа | dotnet_style_require_accessibility_modifiers |
| Модификаторы Order | IDE0036 |
| Чтение поля | dotnet_style_readonly_field |
| Удалить лишние операции приведения | IDE0004 |
| Применение параметров инициализации объекта или коллекции) | dotnet_style_object_initializer |
| Применение параметров размещения директив | csharp_using_directive_placement |
| Применение настроек круглых скобок | IDE0047-IDE0048 |
| Применение неиспользуемых настроек значений | IDE0058 |
| Применить настройки типа языка или платформы | IDE0049 |
| Удаление неиспользуемых подавлений | dotnet_remove_unnecessary_suppression_exclusions |
| Применение логического выражения | dotnet_style_prefer_simplified_boolean_expressions |
| Применение параметров интерполяции строк | dotnet_style_prefer_simplified_interpolation |
| Удаление неиспользуемых параметров | dotnet_code_quality_unused_parameters |
| Применение параметров автоматического свойства | dotnet_style_prefer_auto_properties |
| Применение параметров составного назначения | dotnet_style_prefer_compound_assignment |
| Применение параметров выражения объединения | dotnet_style_coalesce_expression |
| Применение параметров условного выражения | dotnet_style_prefer_conditional_expression_over_assignment dotnet_style_prefer_conditional_expression_over_return |
| Применение параметров имени кортежа | dotnet_style_explicit_tuple_names dotnet_style_prefer_inferred_tuple_names |
| Применение параметров имен участников анонимного типа | dotnet_style_prefer_inferred_anonymous_type_member_names |
| Применение параметров проверка null | dotnet_style_prefer_is_null_проверка_over_reference_equality_method |
| Применение параметров распространения NULL | dotnet_style_null_propagation |
| Применение настроек var | IDE0007-IDE0008 |
| Добавление обязательных фигурных скобок для операторов управления с одной строкой | csharp_prefer_braces |
| Применить настройки тела выражения или блока | Элементы, воплощающие выражение |
| Применить настройки встроенных выходных переменных | csharp_style_inlined_variable_declaration |
| Применение параметров сопоставления шаблонов | Параметры сопоставления шаблонов |
| Применение параметров вызова условного делегата | csharp_style_conditional_delegate_call |
| Применение настроек статической локальной функции | csharp_prefer_static_local_function |
| Применение параметров деконструкция | csharp_style_deconstructed_variable_declaration |
| Применение параметров по умолчанию (T) | csharp_prefer_simple_default_expression |
| Применение параметров new() | csharp_style_implicit_object_creation_when_type_is_apparent |
| Применение параметров диапазона | csharp_style_prefer_range_operator |
| Применение локальных параметров анонимной функции | csharp_style_pattern_local_over_anonymous_function |
| Применение параметров NULL | Параметры проверки NULL |
| Применение параметров инструкции using | csharp_prefer_simple_using_statement |
| Применение параметров выражения throw | csharp_style_throw_expression |
Если вы хотите, чтобы параметры стиля кода применялись каждый раз при сохранении файла, перейдите в раздел> «Параметры очистки кода»>и выберите «Выполнить профиль очистки кода» при сохранении.
Если вы хотите применять параметры стиля кода при каждом сохранении файла, вам может подойти расширение для очистки кода при сохранении.
Связанный контент
- Быстрые действия
- Параметры соглашений о написании кода .NET в EditorConfig
- Поведение редактора (Visual Studio для Mac)
Форматирование кода с помощью Prettier в Visual Studio Code
Согласованное форматирование кода — сложная задача, но современные инструменты разработчиков позволяют автоматически обеспечивать согласованность базы кода вашей команды.
В этой статье мы настроим Prettier для автоматического форматирования кода в Visual Studio Code или VS Code.
Для демонстрации мы будем форматировать следующий код:
const name = "James"; const person =first: name > console.log(person); const sayHelloLinting = (fName) => console.log(`Hello linting, $fName>`) > sayHelloLinting('James'); Если вы знакомы с форматированием кода, вы можете заметить некоторые упущения:
- Смесь одинарных и двойных кавычек.
- Первое свойство объекта person должно находиться в отдельной строке.
- Выражение консоли внутри функции должно быть выделено отступами.
- Вам могут понравиться или не понравиться необязательные скобки, в которые заключен параметр функции arrow.
Предварительные требования
Для прохождения этого учебного модуля вам нужно будет загрузить и установить Visual Studio Code.
Чтобы работать с Prettier в Visual Studio Code, вам потребуется установить расширение. Для этого выполните поиск инструмента Prettier — Code Formatter в панели расширений VS Code. Если вы устанавливаете его в первый раз, вы увидите кнопку install вместо кнопки uninstall, как показано здесь:
Шаг 1 — Использование команды форматирования документа
После установки расширения Prettier вы можете использовать его для форматирования вашего кода. Для начала выполним обзор, используя команду Format Document. Эта команда сделает ваш код более согласованным с отформатированными пробелами, переносами строк и кавычками.
Чтобы открыть палитру команд, вы можете использовать COMMAND + SHIFT + P в macOS или CTRL + SHIFT + P в Windows.
Выполните в палитре команд поиск по ключевому слову format и выберите Format Document.
Возможно, вам будет предложено выбрать формат для использования. Для этого нажмите кнопку Configure:
Затем выберите Prettier — Code Formatter.
Примечание. Если вы не видите диалога выбора формата по умолчанию, вы можете вручную изменить его в разделе «Настройки». Установите для Editor: Default Formatter значение esbenp.prettier-vscode .
Теперь ваш код отформатирован с пробелами, переносами строк и единообразными кавычками:
const name = 'James'; const person = first: name >; console.log(person); const sayHelloLinting = (fname) => console.log(`Hello linting, $fName>`); > sayHelloLinting('James'); Это работает и для файлов CSS. Вы можете превращать код с несогласованными отступами, скобками, разрывами строк и точками с запятой в хорошо отформатированный код. Например:
body color: red; > h1 color: purple; font-size: 24px > Будет переформатирован как:
body color: red; > h1 color: purple; font-size: 24px; > Мы изучили эту команду, и теперь посмотрим, как можно реализовать ее автоматическое выполнение.
Шаг 2 — Форматирование кода при сохранении
До сих пор вам нужно было вручную запускать команды для форматирования кода. Чтобы автоматизировать этот процесс, вы можете выбрать в VS Code настройку, чтобы ваши файлы автоматически форматировались при сохранении. Это также гарантирует, что неформатированный код не попадет в систему контроля версий.
Чтобы изменить эту настройку, нажмите COMMAND + в macOS или CTRL + в Windows, чтобы открыть меню Settings (Настройки). Выполните в меню поиск Editor: Format On Save и убедитесь, что эта опция включена:
Теперь вы можете писать код как обычно, и он будет автоматически форматироваться при сохранении файла.
Шаг 3 — Изменение параметров конфигурации Prettier
Prettier выполняет много действий по умолчанию, но вы также можете внести индивидуальные изменения в его настройки.
Откройте меню Settings (Настройки). Выполните поиск Prettier. Вы увидите список всех параметров, которые вы можете изменить:
Вот несколько наиболее распространенных параметров:
- Single Quote — выберите, нужно ли использовать одинарные или двойные кавычки.
- Semi — выберите, нужно ли добавлять точку с запятой в конце строк.
- Tab Width — укажите, сколько пробелов должно вставляться при табуляции.
Недостаток использования меню встроенных параметров VS Code заключается в том, что при этом не обеспечивается согласованность между разработчиками в вашей команде.
Шаг 4 — Создание файла конфигурации Prettier
Если вы измените настройки VS Code, у другого разработчика может оказаться совершенно иная конфигурация. Вы можете обеспечить единство форматирования в своей команде, создав файл конфигурации для вашего проекта.
Создайте новый файл .prettierrc. extension с одним из следующих расширений:
Вот пример простого файла конфигурации в формате JSON:
"trailingComma": "es5", "tabWidth": 4, "semi": false, "singleQuote": true > Более конкретную информацию о файлах конфигурации можно найти в документации по Prettier. После создания такого файла и его добавления в проект вы можете быть уверены, что все члены команды используют одинаковые правила форматирования.
Заключение
Иметь согласованный код — очень хорошая практика. Это особенно полезно при работе над проектом с несколькими участниками. Согласование конфигурации делает код более удобочитаемым и понятным. Это позволяет уделить больше времени решению технических проблем, а не тратить время на исправление отступов.
Prettier обеспечивает согласованность форматирования кода и позволяет автоматизировать этот процесс.
Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.