Широкое морское погружение, птицы летают высоко в небе. Эй привет! Я Цинь Аидэ. 😄
Непримечательная работа и рыбалка, да еще и мысли о том, как бы какать с оплатой? Нет-нет, сегодня поговорим о полезных плагинах в vscode, повышающих эффективность работы.
в предыдущемПоделитесь 10 vscode «рыбацкими артефактами», которые могут улучшить индекс счастья для всех «старых гребцов» здесьПосле того, как эта статья была опубликована, она также получила много лайков от друзей.Мы не можем ловить рыбу в течение дня, мы должны сделать что-то серьезное. Настоящим я собрал несколько полезных плагинов vscode.Если вы считаете, что это хорошо, можете нажать три раза.Ваши лайки - самая большая мотивация для меня, чтобы продолжать писать статьи 🙈🙈🙈
Эта статья изОсновное обязательно,спецификация кода,артефакт разработкиРекомендуются три аспекта, и задействованы все аспекты.артефактДавайте весело программировать вместе!
😏😏😏Впереди высокая энергия, предупреждение о нескольких изображениях😏😏😏
Базовый универсальный плагин
Chinese
vscode
Пакет редактора китайский, после установки, вlocale.json
добавлено в"locale": "zh-cn"
для загрузки китайского (упрощенного) языкового пакета.
Auto Rename Tag
Автоматические переименованные парыHTML
Отметьте, измените начальный тег, конечный тег будет изменен синхронно
Фрагменты HTML
Фрагменты HTML-кода, плагин может предоставить вам подсказки по коду для HTML-тегов, не нужно вводить угловые скобки.
Bracket Pair Colorizer
Плагин может раскрасить пары скобок для вас и предоставить соединительный провод. Нам удобно просматривать структуру кода.Модифицируя файл конфигурации, строки структуры подсвечиваются, и еда становится лучше.
"workbench.colorCustomizations": {
"editorIndentGuide.activeBackground": "#00ffea"
},
CSS Peek
Средство просмотра стилей CSS, вы можете быстро просмотреть наши стили CSS, очень удобно и быстро
Npm Intellisense
Это можно сделать автоматически, импортируя операторный модуль npm.
open in browser
быстро открытьhtml
Файл для просмотра в браузере
vscode-icons
Предоставляет очень красивую тему значков дерева каталогов.
Auto Close Tag
автоматическое закрытиеHTML/XML
Этикетка
Path Intellisense
Автоматически запрашивать путь к файлу, поддерживать различные файлы быстрого импорта
Image preview
Наведите указатель мыши на ссылку, чтобы вовремя просмотреть изображение.
Beautify
Щелкните правой кнопкой мыши файл в коде для форматированияhtml,js,css
JavaScript (ES6) code snippets
Интеллектуальный синтаксис ES6 и быстрая печать
Vetur
VScode
Официально назначенный плагин Vue,Vue
Обязательно для разработчиков. Содержит подсветку синтаксиса, умные подсказки,emmet
, подсказки об ошибках, форматирование, автодополнение,debugger
и другие практические функции
Плагин спецификации стиля кода
ESlint
Стандартизируйте правила написания кода js, если вы считаете, что это слишком строго, вы можете настроить правила
TSLint
Спецификация написания ts, этот плагин представляет собой серию, а также предоставляетTSLint (deprecated)
,TSLint Vue
,TSLint Vue-TSX
Code Spell Checker
это средство проверки орфографии, которое проверяет необычные слова и выдает предупреждение, если слово написано с ошибкой
koroFileHeader
существуетvscode
Плагин, используемый для создания комментариев к заголовкам файлов и комментариев к функциям, после нескольких итераций плагин: поддерживает все основные языки, мощный, гибкий и удобный, полная документация, легко есть!
Не только это, но и создание некоторых особенно интересных аннотаций, таких как этот огнедышащий дракон...
Better Align
Аккуратность и опрятность написания кода часто является эталоном для измерения качества программиста.Этот плагин может сделать ваш код более элегантным в верстке
Выберите код с комбинацией клавиш[Ctrl+Shift+p]
,войтиAlign
Только что,
change-case
Обычно мы можем назвать переменную в верблюжьем регистре, в верхнем регистре или подчеркиванием, Здесь мы можем использовать этот плагин для решения проблемы соглашений об именах переменных.
Выберите переменную с комбинацией клавиш[Ctrl+Shift+p]
, введите соответствующий формат
extension.changeCase.commands:列出所有“更改案例”命令,如果仅选择一个单词,则带有预览
extension.changeCase.camel:更改大小写'camel':转换为字符串,并用下一个字母大写表示分隔符
extension.changeCase.constant:更改大小写“常量”:转换为大写字母,下划线分隔字符串
extension.changeCase.dot:更改大小写的“点”:转换为小写,句点分隔的字符串
extension.changeCase.kebab:更改大小写“ kebab”:转换为小写字母,用破折号分隔的字符串(参数名的别名)
extension.changeCase.lower:更改大小写为“小写”:转换为小写的字符串
extension.changeCase.lowerFirst:更改大小写“ lowerFirst”:转换为首字母小写的字符串
extension.changeCase.no:转换没有任何大小写的字符串(小写字母,空格分隔)
extension.changeCase.param:更改大小写为'param':转换为小写字母,用破折号分隔的字符串
extension.changeCase.pascal:更改大小写“ pascal”:转换为以与camelCase相同的方式表示的字符串,但首字母也大写
extension.changeCase.path:更改大小写的“路径”:转换为小写,用斜杠分隔的字符串
extension.changeCase.sentence:更改大小写的“句子”:转换为小写的空格分隔的字符串
extension.changeCase.snake:更改大小写“ snake”:转换为小写字母,下划线分隔字符串
extension.changeCase.swap:更改大小写“交换”:转换为每个大小写相反的字符串
extension.changeCase.title:更改大小写“标题”:转换为以空格分隔的字符串,每个单词的第一个字符均大写
extension.changeCase.upper:更改大小写为大写:转换为大写字符串
extension.changeCase.upperFirst:更改大小写为“ upperFirst”:转换为首字母大写的字符串
Better Comments
Этот плагин может обогатить цвет аннотаций и сделать аннотации более живыми.Если вы хотите настроить стиль, вам нужно написать код конфигурации
配置代码
"better-comments.tags": [
{
"tag": "*",
"color": "#98C379",
"strikethrough": false,
"backgroundColor": "transparent"
}
]
使用
// * 绿色的高亮注释
TODO Tree
Мы часто используем в кодеTODO
чтобы разметить наш код для лучшей читабельности,TODO Tree
Этот плагин предоставляет визуальное окно для просмотра и управления нашимиTODO Tree
GitLens
GitLens
Может помочь вам лучше понять код. Быстро просматривайте объекты, которые изменяют строки или блоки кода, мощные, многофункциональные и легко настраиваемые в соответствии с вашими потребностями.
GitHistory
GitHistory
Git log можно просматривать и графику и подробную информацию искать, сравнивать, а также поддерживает ветки, управление ветками и другие операции, очень удобно
Другие плагины (артефакты)
Partial Diff
Сравнение файлов — очень распространенная сцена, если различать ее невооруженным глазом, то она утомительна и подвержена ошибкам. Partial Diff
Появление только что решило эту проблему
Markdown All in One
Этот артефакт позволяет намvscode
счастливое письмо внутриMarkdown
,Мощный. Предоставляет множество сочетаний клавиш, вы можете писать и читать, а также легко конвертировать вhtml
илиpdf
файл, очень прост в использовании, настоятельно рекомендуется
vscode-drawio
Этот артефакт позволяет намvscode
Блок-схема счастливого рисования внутри. новый.drawio
suffix и перетащите его в vscode, вы можете получить следующий интерфейс👇
Polacode-2020
Этот артефакт может конвертировать наш код в полноценную картинку, при написании статей или кодшеринге. Выкинуть такую картинку гораздо приличнее, чем случайный скриншот.
REST Client
Этот артефакт позволяет намvscode
Отладка интерфейса выполняется внутри, предоставляя богатые методы настройки API, так что мы можем вызвать отладку интерфейса в любое время, не выходя из редактора.
создать новый.http
файл, запишите основной тестовый код, нажмите Send Request
Вы можете просмотреть результаты возврата интерфейса в правом окне, очень приятно, настоятельно рекомендуется
Для получения дополнительных конфигураций использования вы можете просмотреть официальную документациюпортал
Browser Preview
Этот артефакт позволяет намvscode
Откройте браузер внутри и просматривайте его во время кодирования. Его также можно использовать для рыбалки время от времени. Это очень человечно и настоятельно рекомендуется.
JavaScript Booster
Артефакт, где мы можем написать код, не регулируется и не подлежит настройке, после фокусировки курсора будет небольшая лампочка. Это подскажет иррациональные причины и соответствующие программы улучшения. Значительно улучшает элегантность нашего кода, настоятельно рекомендуется
Сделайте свою жизнь проще и используйте кодовые действия для выполнения повторяющихся задач за вас! Они могут очень помочь, просто следуйте за лампочкой 💡!
когда вJavaScript
(илиTypeScript / Flow
), этоVS Code
Расширение предоставляет различные манипуляции с кодом (быстрые исправления). Просто обратите внимание на лампочку слева и нажмите на нее, чтобы узнать, как перевести код под курсором.
Settings Sync
Этот артефакт позволяет намvscode
vscode
, вам нужно только войти в учетную запись, чтобы синхронизировать конфигурацию, вместо того, чтобы снова начинать с нуля. Не слишком ароматный, очень рекомендуется
Live Share
Этот артефакт позволяет вам совместно редактировать и отлаживать в реальном времени с другими, независимо от того, какой язык программирования вы используете или тип приложения, которое вы создаете. Что это значит? То есть несколько человек могут редактировать код одновременно, что почти означает совместное использование кода. Я должен сказать, что этот артефакт удивителен и настоятельно рекомендуется.
Используйте описание на официальном сайте
Visual Studio Live Share
Позволяет вам совместно редактировать и отлаживать в режиме реального времени с другими, независимо от того, какой язык программирования вы используете или тип приложения, которое вы создаете. Это позволяет вам немедленно (безопасно) поделиться текущим проектом, а затем поделиться сеансом отладки, экземпляром терминала,localhost Web
Приложения, голосовые вызовы и многое другое! Разработчики, присоединяющиеся к вашему сеансу, получают весь контекст редактора из вашей среды (например, языковые службы, отладку), гарантируя, что они могут сразу же начать продуктивное сотрудничество без необходимости клонирования каких-либо репозиториев или установки чего-либо.SDK
.
Кроме того, в отличие от традиционного парного программирования,Visual Studio Live Share
Позволяет разработчикам работать вместе, сохраняя при этом свои личные настройки редактора (например, темы, привязки клавиш), а также собственные курсоры. Таким образом, вы можете плавно переходить друг от друга и иметь возможность самостоятельно исследовать идеи/задачи. На практике эта способность работать вместе и независимо обеспечивает совместный опыт, который, вероятно, будет иметь более естественные общие варианты использования.
Ну это то, что я рекомендую для всех33оплатаvscode
Плагин, надеюсь, вам понравится. Кроме того, в последнее время ситуация с эпидемией обострилась, надеюсь, вы все будете здоровы и носите маски, давайте вместе безболезненно переживем это непростое время.2020,Ну давай же! Ну давай же!
Посыпать цветами, посыпать цветами 🌸🌸🌸🌸🌸🌸🌸🌸
Ставьте 👍 и смотрите снова, уже вошло в привычку! Эта серия постоянно обновляется. Ваша тройная ссылка в один клик - самая большая мотивация для меня продолжать писать. Если у вас есть какие-либо комментарии и предложения по этому блогу, вы можете оставить сообщение! Добро пожаловать, чтобы беспокоить! 😜😝
Я Цинь Эйдэ, программист, который выживает в Интернете!