默認片段解釋

{
  "demo": {
    "scope": "javascript,typescript,vue", // 作用域，這里代表在js、ts、vue中都可以觸發快捷方式
    "prefix": "vue3-ts", // 快捷觸發代號/命令
    "body": [ // 代碼塊內容，每一行都要用""雙引號包裹，如果需要縮進手動按空格
      "<template>$1</template>" // $1,代表你生成的代碼塊后，你的光標位置，方便編輯
    ],
    "description": "vue3 components" // 表示你對快捷代碼塊的注釋，方便看文件的時候理解
  }
}

實例

• 創建一個 vue3 + ts 的自定義代碼片段

{
	"vue3-ts": {
		"scope": "javascript,typescript,vue",
		"prefix": "vue3-ts",
		"body": [
		  "<template>",
	      "",
	      "</template>",
	      "",
	      "<script lang=\"ts\">",
	      "import { defineComponent } from 'vue'",
	      "",
	      "export default defineComponent({",
	      "  name: '',",
	      "  setup () {",
	      "    return {",
	      "    }",
	      "  }",
	      "})",
	      "</script>",
	      "",
	      "<style lang=\"scss\">",
	      "",
	      "</style>"
		],
		"description": "vue3-ts init components"
	}
}

接下來只需要在 .vue 文件中輸入 vue3-ts 就會生成自定義代碼片段了。