VSCode快速生成vue组件模版

1,点击设置,找到代码片段

2,搜索vue,打开vue.json

3,添加模版

vue2模板

"vue2": {
        "prefix": "vue2",
        "body": [
            "<template>",
            "  <div>$0</div>",
            "</template>",
            "",
            "<script lang=\"ts\">",
            "export default {",
            "  components: {},",
            "  props: {},",
            "  data() {",
            "    return {",
            "    };",
            "  },",
            "  watch: {},",
            "  computed: {},",
            "  methods: {},",
            "  created() {},",
            "  mounted() {}",
            "};",
            "</script>",
            "<style lang=\"scss\" scoped>",
            "</style>"
        ],
        "description": "快速创建vue2模板"
    }

vue3模板

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

保存vue.json文件

4,在vue文件中输入vue2或vue3就会生成模板内容,模板内容可根据自己需求修改

相关推荐
尚学教辅学习资料13 分钟前
基于SpringBoot+vue+uniapp的智慧旅游小程序+LW示例参考
vue.js·spring boot·uni-app·旅游
IT、木易1 小时前
跟着AI学vue第五章
前端·javascript·vue.js
薛定谔的猫-菜鸟程序员1 小时前
Vue 2全屏滚动动画实战:结合fullpage-vue与animate.css打造炫酷H5页面
前端·css·vue.js
春天姐姐2 小时前
vue3项目开发总结
前端·vue.js·git
一根烂笔头2 小时前
Mac M3/M4 本地部署Deepseek并集成vscode
vscode·ai·mac·deepseek·m4
烂蜻蜓5 小时前
前端已死?什么是前端
开发语言·前端·javascript·vue.js·uni-app
谢尔登6 小时前
Vue 和 React 的异同点
前端·vue.js·react.js
祈澈菇凉10 小时前
Webpack的基本功能有哪些
前端·javascript·vue.js
少年姜太公11 小时前
搞懂面试常考的watch和watchEffect,看这篇文章就够了
前端·javascript·vue.js
yanglamei196212 小时前
基于Python+Django+Vue的旅游景区推荐系统系统设计与实现源代码+数据库+使用说明
vue.js·python·django