vscode 配置代码片段

103 阅读1分钟

操作

image.png

image.png

image.png

vue3 代码片段

在文件夹下复制如下代码

{
   "Vue tempalte": {
       // 快捷键
       "prefix": "v3",
       "body": [
          "<template>",
          "<div>",
          "</div>",
          "</template>",
          "<script setup>",
          "import { ref, onMounted, computed, watch, nextTick } from 'vue'",
          "import { ElMessage } from 'element-plus'",
          "</script>",
          "<style lang='scss' scoped>",
          "</style>",
       ],
       "description": "Vue3 tempalte"
   }
}

使用

输入v3 敲回车即可

image.png

image.png

常用片段

v3

{
    "Vue tempalte": {
         // 快捷键
         "prefix": "v3",
         "body": [
             "<template>",
             "<div>",
             "</div>",
             "</template>",
             "<script setup>",
             "import { ref, onMounted, computed, watch, nextTick } from 'vue'",
             "import { ElMessage } from 'element-plus'",
             "</script>",
             "<style lang='scss' scoped>",
             "</style>",
         ],
         "description": "Vue3 tempalte"
    }
}