vscode配置vue2, vue3模板

最新推荐文章于 2024-08-30 01:40:33 发布

sunnyboysix

最新推荐文章于 2024-08-30 01:40:33 发布

阅读量1.1k

点赞数 1

分类专栏： vue3 文章标签： vscode ide 编辑器

本文链接：https://blog.csdn.net/sunnyboysix/article/details/126501099

版权

vue3 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

访问地址：https://snippet-generator.app/?description=&tabtrigger=&snippet=&mode=vscode

一 vue2

<template>
  <div>

  </div>
</template>

<script>
export default {
  name: '',
  data() {
    return {

    }
  },
  methods: {

  }
}
</script>

<style lang="less" scoped>

</style>

二 vue3

<template>

</template>

<script setup lang="ts">

</script>

<style lang="less" scoped>

</style>

三 vscode配置

设置 - 配置用户代码片段

找到vue.json

{
	"vue": {
		"prefix": "vue",
		"body": [
			"<template>",
			"  <div>",
			"    ",
			"  </div>",
			"</template>",
			"",
			"<script>",
			"export default {",
			"  name: '',",
			"  data() {",
			"    return {",
			"",
			"    }",
			"  },",
			"  methods: {",
			"",
			"  }",
			"}",
			"</script>",
			"",
			"<style lang=\"less\" scoped>",
			"",
			"</style>"
		],
		"description": ""
	},

	"vue3": {
		"prefix": "vue3",
		"body": [
			"<template>",
			"",
			"</template>",
			"",
			"<script setup lang=\"ts\">",
			"",
			"</script>",
			"",
			"<style lang=\"less\" scoped>",
			"",
			"</style>"
		],
		"description": ""
	}
}