IDE 配置

VSCode

快速生成 Vue3 模板

设置 > 代码片段 > 输入 vue > 打开 vue.json 文件

在注释内容下边，粘贴如下代码：

vue.json

"vue3": {
  "prefix": "vue3",
  "body": [
    "<template>",
    "  <div class=\"$1\">",
    "",
    "  </div>",
    "</template>",
	"",
    "<script setup lang=\"ts\">",
    "",          
    "</script>",
    "",
    "<style lang=\"scss\" scoped>",
    "",
    "</style>",
    ""
  ],
  "description": "快速创建vue3模板"
}

User Settings

{
  "settingsSync.ignoredExtensions": [],

  "workbench.colorTheme": "Dracula Theme",
  "workbench.iconTheme": "vscode-icons-mac",
  "workbench.editor.enablePreview": false,

  "editor.tabSize": 2,
  "editor.stickyScroll.enabled": true,
  "editor.fontFamily": "JetBrains Mono, Consolas, 'Courier New', monospace",
  "editor.cursorBlinking": "smooth",
  "editor.cursorSmoothCaretAnimation": "on",

  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true,
  "[vue]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[scss]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },

  "colorize.languages": [
    "html",
    "javascript",
    "css",
    "sass",
    "scss",
    "less",
    "postcss",
    "sss",
    "stylus",
    "xml",
    "svg"
  ]
}