Поделитесь 33 «практичными плагинами» vscode, повышающими эффективность работы, для всех «работников» здесь

JavaScript
Поделитесь 33 «практичными плагинами» vscode, повышающими эффективность работы, для всех «работников» здесь

Широкое морское погружение, птицы летают высоко в небе. Эй привет! Я Цинь Аидэ. 😄

Непримечательная работа и рыбалка, да еще и мысли о том, как бы какать с оплатой? Нет-нет, сегодня поговорим о полезных плагинах в 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

GitHistoryGit log можно просматривать и графику и подробную информацию искать, сравнивать, а также поддерживает ветки, управление ветками и другие операции, очень удобно

Другие плагины (артефакты)

Partial Diff

Сравнение файлов — очень распространенная сцена, если различать ее невооруженным глазом, то она утомительна и подвержена ошибкам. Partial DiffПоявление только что решило эту проблему

Markdown All in One

Этот артефакт позволяет намvscodeсчастливое письмо внутриMarkdown,Мощный. Предоставляет множество сочетаний клавиш, вы можете писать и читать, а также легко конвертировать вhtmlилиpdfфайл, очень прост в использовании, настоятельно рекомендуется

vscode-drawio

Этот артефакт позволяет намvscodeБлок-схема счастливого рисования внутри. новый.drawiosuffix и перетащите его в vscode, вы можете получить следующий интерфейс👇

Polacode-2020

Этот артефакт может конвертировать наш код в полноценную картинку, при написании статей или кодшеринге. Выкинуть такую ​​картинку гораздо приличнее, чем случайный скриншот.

REST Client

Этот артефакт позволяет намvscodeОтладка интерфейса выполняется внутри, предоставляя богатые методы настройки API, так что мы можем вызвать отладку интерфейса в любое время, не выходя из редактора.

создать новый.httpфайл, запишите основной тестовый код, нажмите Send RequestВы можете просмотреть результаты возврата интерфейса в правом окне, очень приятно, настоятельно рекомендуется

Для получения дополнительных конфигураций использования вы можете просмотреть официальную документациюпортал

Browser Preview

Этот артефакт позволяет намvscodeОткройте браузер внутри и просматривайте его во время кодирования. Его также можно использовать для рыбалки время от времени. Это очень человечно и настоятельно рекомендуется.

JavaScript Booster

Артефакт, где мы можем написать код, не регулируется и не подлежит настройке, после фокусировки курсора будет небольшая лампочка. Это подскажет иррациональные причины и соответствующие программы улучшения. Значительно улучшает элегантность нашего кода, настоятельно рекомендуется

Сделайте свою жизнь проще и используйте кодовые действия для выполнения повторяющихся задач за вас! Они могут очень помочь, просто следуйте за лампочкой 💡!

когда вJavaScript(илиTypeScript / Flow), этоVS CodeРасширение предоставляет различные манипуляции с кодом (быстрые исправления). Просто обратите внимание на лампочку слева и нажмите на нее, чтобы узнать, как перевести код под курсором.

Settings Sync

Этот артефакт позволяет намvscodevscode, вам нужно только войти в учетную запись, чтобы синхронизировать конфигурацию, вместо того, чтобы снова начинать с нуля. Не слишком ароматный, очень рекомендуется

Live Share

Этот артефакт позволяет вам совместно редактировать и отлаживать в реальном времени с другими, независимо от того, какой язык программирования вы используете или тип приложения, которое вы создаете. Что это значит? То есть несколько человек могут редактировать код одновременно, что почти означает совместное использование кода. Я должен сказать, что этот артефакт удивителен и настоятельно рекомендуется.

Используйте описание на официальном сайте

Visual Studio Live ShareПозволяет вам совместно редактировать и отлаживать в режиме реального времени с другими, независимо от того, какой язык программирования вы используете или тип приложения, которое вы создаете. Это позволяет вам немедленно (безопасно) поделиться текущим проектом, а затем поделиться сеансом отладки, экземпляром терминала,localhost WebПриложения, голосовые вызовы и многое другое! Разработчики, присоединяющиеся к вашему сеансу, получают весь контекст редактора из вашей среды (например, языковые службы, отладку), гарантируя, что они могут сразу же начать продуктивное сотрудничество без необходимости клонирования каких-либо репозиториев или установки чего-либо.SDK.

Кроме того, в отличие от традиционного парного программирования,Visual Studio Live ShareПозволяет разработчикам работать вместе, сохраняя при этом свои личные настройки редактора (например, темы, привязки клавиш), а также собственные курсоры. Таким образом, вы можете плавно переходить друг от друга и иметь возможность самостоятельно исследовать идеи/задачи. На практике эта способность работать вместе и независимо обеспечивает совместный опыт, который, вероятно, будет иметь более естественные общие варианты использования.

Ну это то, что я рекомендую для всех33оплатаvscodeПлагин, надеюсь, вам понравится. Кроме того, в последнее время ситуация с эпидемией обострилась, надеюсь, вы все будете здоровы и носите маски, давайте вместе безболезненно переживем это непростое время.2020,Ну давай же! Ну давай же!

Посыпать цветами, посыпать цветами 🌸🌸🌸🌸🌸🌸🌸🌸

Ставьте 👍 и смотрите снова, уже вошло в привычку! Эта серия постоянно обновляется. Ваша тройная ссылка в один клик - самая большая мотивация для меня продолжать писать. Если у вас есть какие-либо комментарии и предложения по этому блогу, вы можете оставить сообщение! Добро пожаловать, чтобы беспокоить! 😜😝

Я Цинь Эйдэ, программист, который выживает в Интернете!