178 lines
6.2 KiB
Markdown
178 lines
6.2 KiB
Markdown
|
---
|
|||
|
|
source: https://habr.com/ru/post/650561/
|
|||
|
|
tags:
|
|||
|
|
- vscode
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
![[98db83549246b158d542b19a8aa3aa9a.jpg]]
|
|||
|
|
|
|||
|
|
Как при помощи небольших твиков можно улучшить интерфейс :dev_vscode_original: VS Code, убрав ненужные визуальные элементы интерфейса.
|
|||
|
|
|
|||
|
|
## Вступление
|
|||
|
|
|
|||
|
|
Обилие всевозможных тем для VS Code радует. На вкус и цвет недостатка в темах нет. Но что делать, если новые темы уже не вызывают восторга, а появляется желание скрыть тот или иной, не такой уж и нужный лично вам, элемент интерфейса. Попробуем сегодня в этом разобраться.
|
|||
|
|
|
|||
|
|
Давайте сначала посмотрим, к какому результату мы придём:
|
|||
|
|
|
|||
|
|
![[Pasted image 20240106211227.jpg]]
|
|||
|
|
|
|||
|
|
Было скрыто много чего: горизонтальная и вертикальная полосы прокрутки, миникарта, нумерация строк, вкладки, статус бар, хлебные крошки, иконки и прочие, труднопереводимые на русский язык штуки.
|
|||
|
|
|
|||
|
|
## Подготовка
|
|||
|
|
|
|||
|
|
Если вы уже знаете, как обращаться с Settings.JSON, переходите к следующему разделу, нового тут нет ничего.
|
|||
|
|
|
|||
|
|
Для тех, кому это всё впервые, открываем файл настроек Settings.JSON:
|
|||
|
|
|
|||
|
|
Нажимаем комбинацию клавиш: CTRL+SHIFT+P
|
|||
|
|
|
|||
|
|
В выпавшем окне печатаем: "settings.json" и выбираем "Preferences: Open Settings(JSON)".
|
|||
|
|
|
|||
|
|
![[a80a25428a7ca93f032a5c86e32ab93c.jpg]]
|
|||
|
|
|
|||
|
|
Открывшийся файл настроек будет наподобие этого(у вас могут быть другие значения):
|
|||
|
|
|
|||
|
|
![[fe8dce6b69b165a95602c5fe254576a4.jpg]]
|
|||
|
|
|
|||
|
|
В этот файл, в конец списка, через запятую мы и будем добавлять наши твики. Чтобы визуально разграничить наши твики от того, что уже было до нас в этом файле, добавьте пару пробелов и(или) комментарий, как показано ниже:
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
## Основная часть
|
|||
|
|
|
|||
|
|
### Убираем горизонтальную полосу прокрутки
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.scrollbar.horizontal": "hidden"
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Убираем вертикальную полосу прокрутки
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.scrollbar.vertical": "hidden"
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Избавляемся от миникарты
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.minimap.enabled": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Скрываем полосу рядом с вертикальной полосой прокрутки
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.overviewRulerBorder": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Скрываем нумерацию строк
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.lineNumbers": "off"
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
Если возникнет вопрос, как найти нужную строку(например десятую строку):
|
|||
|
|
|
|||
|
|
- Жмём `CTRL`+`P`
|
|||
|
|
- Вбиваем двоеточие и номер строки
|
|||
|
|
|
|||
|
|
### Убираем Glyph Margin. Используется при дебаггинге
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.glyphMargin": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Перемещаем Side Bar и Activity Bar на правую сторону
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"workbench.sideBar.location": "right"
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Скрываем Activity Bar
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
"workbench.activityBar.visible": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
- Показать скрыть Side Bar: `CTRL`+`B`
|
|||
|
|
- Проводник файлов: `CTRL`+`SHIFT`+`E`
|
|||
|
|
- Установки: `CTRL`+`SHIFT`+`X`
|
|||
|
|
- Глобальный поиск: `CTRL`+`SHIFT`+`F`
|
|||
|
|
|
|||
|
|
### Скрываем статус бар
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"workbench.statusBar.visible": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Убираем иконки на вкладках и на "хлебных крошках"
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"workbench.editor.showIcons": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Скрываем вкладки
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"workbench.editor.showTabs": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
Навигация по вкладкам: `CTRL`+`TAB`
|
|||
|
|
|
|||
|
|
### Скрываем "хлебные крошки"
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"breadcrumbs.enabled": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Скрываем визуальные границы функций
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.renderIndentGuides": false
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Избавляемся от подсветки строки, на которой установлен курсор
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
"editor.renderLineHighlight": "none"
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
Получилось довольно неплохо. Давайте сравним до и после:
|
|||
|
|
|
|||
|
|
![[c8902bed59b129768abaadf14ad6072f.gif]]
|
|||
|
|
|
|||
|
|
## Заключение
|
|||
|
|
|
|||
|
|
Разумеется, для кастомизации можно и разных расширений поставить, позволяющих сделать это всё, и ещё много чего. Но, когда расширений итак уже десятки, то с определённого момента, каждое следующее расширение уже как гвоздь в крышку гроба производительности софтины.
|
|||
|
|
|
|||
|
|
Эти твики также применимы и к [веб версии](https://vscode.dev/) Visual Studio Code. По крайней мере те, что я пробовал.
|
|||
|
|
|
|||
|
|
Кстати, именно так выглядит моё рабочее пространство в VS Code, в котором я грокаю код и пишу статьи.
|