vscode配置vue用户代码片段

最新推荐文章于 2024-07-25 23:05:49 发布

红烧咸咸鱼

最新推荐文章于 2024-07-25 23:05:49 发布

阅读量628

点赞数

分类专栏： vue 文章标签： vscode vue.js ide

本文链接：https://blog.csdn.net/weixin_44180579/article/details/132276223

版权

vue 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

打开vscode软件
选中左下角的设置按钮，再点击用户代码片段（如图）
再选择vue.json文件/新建全局代码片段（如图）
进行相关配置（如下代码）

{
	"Vue2 quickly build template": {
		"prefix": "vue2Init",
		"body": [
		  "<template>",
		  "",
		  "</template>",
		  "",
		  "",
		  "<script>",
		  "  export default {",
		  "    data () {",
		  "      return {",
		  "      }",
		  "    }",
		  "  }",
		  "</script>",
		  "",
		  "",
		  "<style scoped>",
		  "",
		  "</style>"    
		],
	  "description": "vue2快速构建模板"
	 },
	"Vue3 quickly build template": {
		  "prefix": "vue3Init",
		  "body": [
			"<template>",
			"\t<div>\n",
			"\t</div>",
			"</template>\n",
			"<script lang='ts' setup>",
			"import { onMounted, reactive, ref, toRefs, watch } from 'vue'\n",
			"</script>\n",
			"<style lang='scss' scoped>\n",
			"</style>",
			"$2"
		  ],
		  "description": "vue3快速构建模板"
	}
}