Как использовать ВС Код, если ты пишешь текст


Каждый второй разработчик использует Visual Studio Code (из результатов опроса Стэковерфлоу). Я перешел на ВС Код с Саблайм Текста год назад и теперь влюблен в новый редактор — высокая функциональность: лайв запуск сайтов, дебаг, гит, терминал, — минималистичный дизайн, ежемесячные обновления и много другого. Проблема появляется, когда мне надо написать простой текст, как этот, для блога. Здесь пригодятся некоторые фишки, для настройки.

В ВС Коде много лишних элементов — они полезны для разработки, но писателя они отвлекают. Поэтому я решил настроить его. Очень удобно настраивать через JSON: отдельное правило для каждого элемента и все легко копируется и вставляется. Чтоб не переключаться между настройками, я установил отдельную инсайдерскую версию, которая работает также стабильно и записал в нее новые правила.

Изменения, которые я внес, отключают функции и прячут элементы:

  1. Скрыл верхнюю панель с кнопками. Я делаю это везде, где могу.
  2. Скрыл боковую панель с большими кнопками.
  3. Скрыл нижнюю статусную панель.
  4. Отредактировал название окна, чтоб не захламлять. Оставил только имя файла и свои символы.
  5. Спрятал вкладки. Они все равно доступны по сочетаниям Ctrl + Tab в Виндоус и ⌘ + ⌥ + Tab в Маке.
  6. Внес изменения в редактор: отключил лишние подсвечивания, убрал номера строк, отключил мини-карту и т. д.
  7. Поработал со шрифтом: не стал убирать моноширинный, но изменил размер.

Применять настройки можно в соответствующем меню: иконка настроек в левом нижнем углу → иконка {} в правом верхнем углу. Сохраните свои нынешние настройки, может быть, вы захотите вернуться, и вставьте эти:

{
// Окно
"window.menuBarVisibility": "toggle", // Скрываю меню бар.
// Доступен по нажатию Alt.
"window.title": "${dirty}${activeEditorShort} ⚡ >_<",
// Изменяю название окна

// Редактор
"editor.cursorSmoothCaretAnimation": true,
// Включаю плавную анимацию движения курсора
"editor.fontFamily": "'Fira Code', Consolas, 'Courier New', monospace",
// Моя настройка шрифтов. Можно вставить свою.
// Fira Code <3
"editor.fontLigatures": true, // Включаю лигатуры.
// Работает только, если ваш шрифт поддерживает их.
"editor.fontWeight": "500", // Меняю ширину шрифта.
// Люблю жирные, но для большого текста неудобно.
"editor.fontSize": 16, // Меняю размер шрифта.
// Поставил на 16, чтоб побольше.
"editor.lineNumbers": "off", // Убираю нумерацию строк.
"editor.wordWrap": "on", // Включаю перенос слов.
"editor.minimap.enabled": false, // Убираю мини-карту.
"editor.renderWhitespace": "none", // Убираю символы,
// которые отображаются вместо пробелов.
"editor.renderIndentGuides": false, // Убираю линию,
// которая помогает определять вложенность в коде.
"editor.renderLineHighlight": "none",
// Убираю подсветку линий.
"editor.overviewRulerBorder": false,
// Убираю рамку у скроллбара.
// Попробуйте включить и посмотрите на скроллбар справа.
"editor.hideCursorInOverviewRuler": true,
// Прячу отображение курсора на скроллбаре.
"editor.folding": false, // Убираю функцию вложенности.
// Если функция включена
// слева можно навести мышкой и увидить иконки.
"editor.occurrencesHighlight": false,
// Убираю другую подсветку.
// Все равно работает при выборе слов.
"editor.glyphMargin": false,
// Убираю место под иконки редактирования и дебага.

// Воркбенч
"workbench.tree.renderIndentGuides": "none",
// Убираю линию,
// которая помогает определять вложенность в папках.
"workbench.editor.showTabs": false, // Отключаю вкладки.
// Отображается только активная на всю ширину.
"workbench.activityBar.visible": false,
// Убираю панель с большими иконками слева.
// Можно получать доступ к вкладкам по сочетаниям клавиш.
"workbench.editor.showIcons": false,
// Убираю иконки из вкладок.
"workbench.statusBar.visible": false,
// Убираю нижнюю панель.
"workbench.colorTheme": "Material Theme Palenight",
// Ставлю кастомную тему.
// Устанавливается из магазина расширений.
"workbench.iconTheme": "material-icon-theme",
// Ставлю кастомную тему иконок.
// Устанавливается из магазина расширений.
"workbench.colorCustomizations": {
// Ставлю кастомный цвет акцента.
"activityBarBadge.background": "#FFA000",
"list.activeSelectionForeground": "#FFA000",
"list.inactiveSelectionForeground": "#FFA000",
"list.highlightForeground": "#FFA000",
"scrollbarSlider.activeBackground": "#FFA00050",
"editorSuggestWidget.highlightForeground": "#FFA000",
"textLink.foreground": "#FFA000",
"progressBar.background": "#FFA000",
"pickerGroup.foreground": "#FFA000",
"tab.activeBorder": "#FFA000",
"notificationLink.foreground": "#FFA000",
"editorWidget.resizeBorder": "#FFA000",
"editorWidget.border": "#FFA000",
"settings.modifiedItemIndicator": "#FFA000",
"settings.headerForeground": "#FFA000",
"panelTitle.activeBorder": "#FFA000",
"breadcrumb.activeSelectionForeground": "#FFA000",
"menu.selectionForeground": "#FFA000",
"menubar.selectionForeground": "#FFA000"
},

// Breadcrumbs
"breadcrumbs.enabled": false, // Убираю Breadcrubms.
// Полоска над редактором со вложенностью.

// Языки
"markdown.preview.fontFamily":
"Inter, Helvetica Neue, Helvetica, sans-serif",
// Меняю шрифт превью маркдауна.
// Inter <3

// Эксплорер
"explorer.openEditors.visible": 0
// Убираю список активных файлов.
}
ВС Код: до моих настроек и после
ВС Код: до моих настроек и после

Многие функции все еще можно получить из Командной строки ВС Кода, Ctrl + Shif + P


Читайте еще