Как настроить коэффициент преобразования табуляции в пространство при использовании кода Visual Studio?
Например, прямо сейчас в HTML он производит два пробела за нажатие TAB, а в TypeScript - 4.
Как настроить коэффициент преобразования табуляции в пространство при использовании кода Visual Studio?
Например, прямо сейчас в HTML он производит два пробела за нажатие TAB, а в TypeScript - 4.
Ответы:
По умолчанию код Visual Studio будет пытаться угадать ваши параметры отступа в зависимости от файла, который вы открываете.
Вы можете отключить угадывание отступов через "editor.detectIndentation": false
.
Вы можете легко настроить это с помощью этих трех настроек для Windows в меню Файл → Настройки → Настройки пользователя и для Mac в меню Code → Preferences → Settings или ⌘,
:
// The number of spaces a tab is equal to. This setting is overridden
// based on the file contents when `editor.detectIndentation` is true.
"editor.tabSize": 4,
// Insert spaces when pressing Tab. This setting is overriden
// based on the file contents when `editor.detectIndentation` is true.
"editor.insertSpaces": true,
// When opening a file, `editor.tabSize` and `editor.insertSpaces`
// will be detected based on the file contents. Set to false to keep
// the values you've explicitly set, above.
"editor.detectIndentation": false
tabSize
язык? например, при редактировании нескольких файлов на разных языках в одной рабочей области (например, Ruby, JavaScript, CSS и т. д.) - Ruby будет 2
пробелами, но CSS будет 4
... обычно.
Я использую версию 1.21, но я думаю, что это может относиться и к более ранним версиям.
Посмотрите на нижнюю правую часть экрана. Вы должны увидеть то, что говорит Spaces
или Tab-Size
.
Шахта показывает пространства, →
Это работает только для одного документа, но не для всего проекта. Если вы хотите применить его для всего проекта, вам также необходимо добавить его "editor.detectIndentation": false
в настройки пользователя.
Ну, если вам нравится способ разработчика, Visual Studio Code позволяет вам указать различные типы файлов для tabSize
. Вот пример моего settings.json
с четырьмя пробелами по умолчанию и двумя пробелами в JavaScript / JSON:
{
// I want my default to be 4, but JavaScript/JSON to be 2
"editor.tabSize": 4,
"[javascript]": {
"editor.tabSize": 2
},
"[json]": {
"editor.tabSize": 2
},
// This one forces the tab to be **space**
"editor.insertSpaces": true
}
PS: Ну, если вы не знаете, как открыть этот файл (особенно в новой версии кода Visual Studio), вы можете:
По умолчанию код Visual Studio автоматически определяет отступ текущего открытого файла. Если вы хотите отключить эту функцию и сделать все отступы, например, два пробела, вы должны сделать следующее в настройках пользователя или рабочей области.
{
"editor.tabSize": 2,
"editor.detectIndentation": false
}
Мы можем контролировать размер вкладки по типу файла с помощью EditorConfig и его EditorConfig для расширения кода VS. Затем мы можем сделать Alt+ Shift+ , Fспецифичные для каждого типа файла.
ext install EditorConfig
[*]
indent_style = space
[*.{js,ts,json}]
indent_size = 2
[*.java]
indent_size = 4
[*.go]
indent_style = tab
EditorConfig переопределяет любой файл settings.json для редактора. Нет необходимости менять editor.detectIndentation
.
ext
вы говорите (ответьте, отредактировав свой ответ, а не здесь, в комментариях (при необходимости))? Какая-то вещь Node.js? Какая платформа?
Если вы используете более красивое расширение в коде Visual Studio, попробуйте добавить его в файл settings.json:
"editor.insertSpaces": false,
"editor.tabSize": 4,
"editor.detectIndentation": false,
"prettier.tabWidth": 4,
"prettier.useTabs": true // This made it finally work for me
В Visual Studio Code версии 1.31.1 или новее (я думаю): как и в случае с Alex Dima , вы можете легко настроить это с помощью этих настроек для
Вы хотите убедиться, что ваш editorconfig не конфликтует с вашей конфигурацией настроек пользователя или рабочей области, так как у меня было некоторое раздражение, когда я думал, что настройки файлов настроек не применялись, когда это была моя конфигурация редактора, отменив эти изменения.
Это lonefy.vscode-js-css-html-formatter
виновато. Отключите его и установите HookyQR.beautify
.
Теперь при сохранении ваши вкладки не будут преобразованы.
В правом нижнем углу у вас есть пробелы: пробелы: 2
Там вы можете изменить отступ в соответствии с вашими потребностями: Параметры отступа
При использовании TypeScript ширина вкладки по умолчанию всегда равна двум, независимо от того, что написано на панели инструментов. Вы должны установить "prettier.tabWidth" в настройках пользователя, чтобы изменить его.
Ctrl+ P, Тип → Настройки пользователя, добавить:
"prettier.tabWidth": 4
Если принятый ответ на этот пост не работает, попробуйте:
У меня был EditorConfig для кода Visual Studio, установленный в моем редакторе, и он продолжал переопределять мои пользовательские настройки, которые были установлены для отступа файлов, используя пробелы. Каждый раз, когда я переключался между вкладками редактора, мой файл автоматически вставлялся с вкладками, даже если я преобразовал отступ в пробелы !!!
Сразу после того, как я удалил это расширение, отступы больше не меняются при переключении вкладок редактора, и я могу работать более комфортно, вместо того, чтобы вручную преобразовывать вкладки в пробелы каждый раз, когда я переключаю файлы - это больно.
Наши любимые участники сообщества уже получили много хороших ответов. Я на самом деле хотел добавить код CS tabSize и нашел эту тему. Я нашел много решений, и официальные документы по VS Code - это круто. Я просто хочу поделиться своими настройками C #:
"[csharp]": {
"editor.insertSpaces": true,
"editor.tabSize": 4
},
просто скопируйте и вставьте приведенный выше код в ваш settings.json
файл и сохраните. Спасибо
Файл меню → Настройки → Настройки
Добавить в настройки пользователя:
"editor.tabSize": 2,
"editor.detectIndentation": false
затем щелкните правой кнопкой мыши по вашему документу, если он у вас уже открыт, и выберите Формат документа, чтобы ваш существующий документ следовал этим новым настройкам.
Решение @ alex-dima от 2015 года изменит размеры вкладок и пробелы для всех файлов, а решение @ Tricky от 2016 года, по-видимому, изменит только настройки для текущего файла.
По состоянию на 2017 год я нашел другое решение, которое работает для каждого языка. Visual Studio Code не использовал правильные размеры вкладок или настройки пространства для Elixir , поэтому я обнаружил, что могу изменить настройки для всех файлов Elixir.
Я щелкнул по языку в строке состояния (в моем случае «Elixir»), выбрал «Настроить языковые настройки на основе« Elixir »...» и отредактировал языковые настройки для Elixir. Я просто скопировал настройки "editor.tabSize" и "editor.insertSpaces" из настроек по умолчанию слева (я так рад, что они показаны), а затем изменил их справа.
Он работал отлично, и теперь все языковые файлы Elixir используют правильный размер вкладки и настройки пространства.
Мне пришлось много редактировать настройки, как в предыдущих ответах, поэтому я не знаю, что заставило его работать после многих модификаций.
Ничего не работало , пока я не закрыл и openen мой IDE, но последние три вещи , которые я сделал Отключает lonefy.vscode-js-css-html-formatter
, "html.format.enable": true,
и перезапустить Visual Studio.
{
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"workbench.colorTheme": "Default Light+",
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features",
"editor.tabSize": 2,
"editor.detectIndentation": false,
"editor.insertSpaces": true
},
"typescript.format.insertSpaceAfterOpeningAndBeforeClosingTemplateStringBraces": true,
"editor.tabSize": 2,
"typescript.format.insertSpaceAfterConstructor": true,
"files.autoSave": "afterDelay",
"html.format.indentHandlebars": true,
"html.format.indentInnerHtml": true,
"html.format.enable": true,
"editor.detectIndentation": false,
"editor.insertSpaces": true,
}
Если это для Angular 2, и CLI генерирует файлы, которые вы хотели бы по-разному отформатировать, вы можете отредактировать эти файлы, чтобы изменить то, что генерируется:
npm_modules/@angular/cli/blueprints/component/files/__path__/*
Не рекомендуется массово, так как обновление npm удалит вашу работу, но сэкономило мне много времени.
Пользователь3550138 правильный. lonefy.vscode-js-css-html-formatter
переопределяет все настройки, упомянутые в других ответах. Однако вам не нужно отключать или удалять его, так как он может быть настроен.
Полные инструкции можно найти, открыв боковую панель расширений и нажав на это расширение, и оно отобразит инструкции по настройке в рабочей области редактора. По крайней мере, это так для меня в Visual Studio Code версии 1.14.1.