Совместное использование плагинов VSCODE для интерфейса vue (2018 г.)

внешний интерфейс JavaScript Chrome Vue.js

Серия плагинов VSCODE

Как может быть меньше плагинов при использовании vscode для разработки?

Богатые плагины облегчают использование vscode.Кстати, я рекомендую карты(адрес фото кровати)

Украсить штекер

  • background Добавьте фон в окно редактора! Минус только в том, что vscode покажет, что он поврежден, конечно, на использование не влияет
    Вы можете обратиться к следующей конфигурации
  "background.useDefault": false,
  "background.style": {
    "content": "''",
    "pointer-events": "none",
    "position": "absolute",
    "z-index": "99999",
    "width": "100%",
    "height": "100%",
    "background-position": "100% 90%",
    "background-size": "auto 60%",
    "background-repeat": "no-repeat",
    "opacity": 0.1
  },
  "background.customImages": [
    "背景图片地址1",
    "背景图片地址2",
    "背景图片地址3"
  ],
  • Carbon-now-sh — очень красивый инструмент для создания скриншотов кода.После интеграции выберите его, а затем с помощью сочетания клавиш можно сделать снимок экрана.

Помощь в развитии

Debugger

  • Отладчик для Chrome просто посмотрите на название
  • открывать в браузере лень открывать браузер
  • Расчет Quokka.js в режиме реального времени, просмотр результатов

Завершение пути и размер пакета

  • File Peek
  • Стоимость импорта рассчитывает, сколько места требуется для импорта
  • Path Intellisense

npm

  • npm
  • NPM-Scripts упрощает запуск скриптов

формат

  • ESLint
  • Более красивое форматирование
  • Форматирование Vetur vue и соответствующая конфигурация
  • Vue 2 Snippets

eslint и prettier используются вместе, vue автоматически сохраняет отформатированную конфигурацию

  "vetur.format.defaultFormatter.html": "none", // 默认html的方法
  "eslint.autoFixOnSave": true, // 自动保存
  "eslint.validate": [
    {
      "language": "vue",
      "autoFix": true
    },
    {
      "language": "html",
      "autoFix": true
    },
    {
      "language": "javascript",
      "autoFix": true
    }
  ],
  "prettier.singleQuote": true, // ' or ""
  "prettier.semi": false, // 分号
  "prettier.eslintIntegration": true, // 走eslint

разное

  • GitLens гораздо проще в использовании, чем встроенный git, он также может показать, кто и когда отправил строку xx.
  • Settings Sync синхронизировать настройки с gitнастоятельно рекомендуетсяКонкретные этапы установки см.блоги других людейЗапишите сочетания клавиш под mac сюда
downloadSettings	    ⇧⌥D
extension.updateSettings    ⇧⌥U

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