Vue-FAQ
919 subscribers
556 photos
90 videos
548 links
Канал сайта https://vue-faq.org
Информация о Vue.js, фронтенд разработке и не только

Contacts: @RuslanMakarov
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Подсказка, как в VS Code можно открыть в отдельном окне Terminal или Search results

#tip #vscode
Volar-у надоело масштабироваться вертикально, он полез горизонтально.

Из-за бага в VSCode (как утверждает Johnson Chu) в расширениях редактора теперь два Vue-Official (ext:Vue.volar). Один - последний 2.0.12 с 60 тысячами скачиваний, другой - 2.0.10 с 7 миллионами скачиваний. Нужен 2.0.12.
Изменить имя, и потерять всю историю...

Также последняя версия хочет, чтобы у вас была достаточно свежая версия VS Code, иначе она превращается в 1.8.27.

#volar #vscode
Сразу после выхода очередного релиза Vitest 1.5.0, вышла новая версия Vitest VS Code extension 0.6. Из нового:

- instant feedback
- .each test declaration
- test tree view
- coverage reporting
- better debugging support
- improved performance

Расширение было не очень популярно, и по сравнению с версией 0.5 было переписано с нуля.

#vitest #vscode
Полезные фичи VS Code:

Сочетания клавиш:
ALT + ←/→ - Идти к прошлому/следующему месту редактирования
ALT + ↑/↓ - Переместить строку/выделение
SHIFT + L - Выделить строку
SHIFT + ALT + ↑/↓ - Дублировать строку/выделение
SHIFT + ALT + ←/→ - Расширить/сузить выделение

CTRL + SHIFT + P => поиск команды по названию

Настройки:
Profiles
Sticky Scroll

Расширения:
Codeium
Code Spell Checker
Todo Tree
Favorites

Следует учитывать, что многие расширения (например, популярное Import Costs) очень сильно жрут ресурсы компьютера и тормозят редактор

#vscode #tip
Мы уже писали пару раз о применении Reactivity API пакета вне Vue фронтенд приложений.

Вот новая библиотека/starter-kit, которая использует Vue Reactivity API для упрощения создания VS Code расширений. Путем отображения VSCode extension API (которая основана на event driven архитектуре) в композаблы. Несколько понижается производительность, значительно повышается DX.

Пока что Vue Reactivity API выглядит лучшей "реализацией" JS Signals.

#vscode #reactivity
Если у вас VS Code тормозит из-за каких-то расширений, то есть такое:

F1 -> Developer: Open Process Explorer
F1 -> Developer: Show Running Extensions

и вообще:

F1 -> Developer: ...

#vscode
Если в VS Code у вас отключено автоматическое обновление редактора или стоит firewall, запрещающий такие запросы, то в один момент Volar или Eslint могут просто перестать работать, потому что их новая версия требует последних версией VS Code (и это случается далеко не редко). Об этом будет краткая запись в output логах Eslint.

Можно потратить кучу времени, пытаясь определить, что сломалось. Логи VS Code - очень полезная штука.

#vscode #volar #eslint #ide
Еще один пример как Volar может сломаться при обновлении / не обновлении VS Code

Intellisense перестает работать во вновь созданных Vue файлах.

#volar #vscode
В последнем VS Code появился более удобный Profile editor.

Еще раз напоминаю о важности использования этой фичи, позволяющей иметь разные настройки и расширения для разных проектов, ощутимо улучшая производительность редактора и общий DX.

Малозаметная штука, сильно облегчающая работу. И чего нет у комбайна JetBrains.

#vscode
Команды VS Code
- Emmet: Balance (outward)
и
- Emmet: Wrap With Abbreviation
помогут быстро обернуть блок кода в шаблоне в новый тэг.

Можно назначить им сочетания клавиш.

#vscode #tip