Как в средствах разработки Vscode не хватает этого плагина (девушка довольна)

Vue.js
Как в средствах разработки Vscode не хватает этого плагина (девушка довольна)

предисловие

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


1. Установка плагина Vue VSCode Snippets

在这里插入图片描述

После первой установки редактора здесь я обнаружил, что некоторые его команды вообще не действуют.Я перезапустил Vscode и никакой реакции.Решение:

Проверьте текущий формат синтаксиса строки состояния внизу:

在这里插入图片描述

Если это html, щелкните всплывающее окно и выберите конфигурацию синтаксиса vue.

在这里插入图片描述Это имеет эффект, давайте воспользуемся функцией этого плагина ниже.

2. Используйте шаги

1. Сгенерируйте базовый код шаблона vue

Во-первых, после использования vscode для создания нового файла .vue он фактически пустой. Я полагаюсь на него, и я вдруг потерял рассудок. Раньше я много пользовался webstorm, и вдруг я к нему не привык.

在这里插入图片描述

Мы установили и настроили плагин выше, мы можем использовать команду плагина для создания базового шаблона нашего vue.

vbase

在这里插入图片描述

Введите vbase и нажмите Enter, это поможет нам сгенерировать базовый шаблон.

在这里插入图片描述

2. Настройте шаблон

Например, в настоящее время вы хотите сгенерировать некоторые аннотации, такие же, как наши классы Java, с базовой информацией описания и временем создания.Как это сделать? Мы уже установили этот плагин, нам просто нужно изменить конфигурацию внутри.

Сначала найдите этот файл jso: C:\Users\DT Developer.vscode\extensions\sdras.vue-vscode-snippets-2.2.0\snippets Как правило, после установки плагина по умолчанию он будет находиться в этом месте.

在这里插入图片描述Откройте vue.json, чтобы добавить собственную конфигурацию, сохраните и перезапустите Vscode.

在这里插入图片描述 在这里插入图片描述

3. Общие сочетания клавиш

Например:

vdata

在这里插入图片描述 在这里插入图片描述Вот все используемые сочетания клавиш:

在这里插入图片描述

Подробности смотрите на официальном сайте:GitHub.com/SD RAS/v UE-V…

Суммировать

Используя правильные инструменты, хорошие инструменты могут повысить эффективность нашей разработки и избежать повторных резюме.Высока эффективность или нет, зависит от того, насколько хорошо используются инструменты.