侧边栏壁纸
博主头像
丛庆

没事儿写代码,有事写代码。email:1024@cong.zone

  • 累计撰写 116 篇文章
  • 累计创建 97 个标签
  • 累计收到 4 条评论

【VSCode】vscode添加vue模板

丛庆
2022-08-05 / 0 评论 / 0 点赞 / 495 阅读 / 276 字 / 正在检测是否收录...
温馨提示:
部分资料和图片来源于网络,如有危害到您的利益请与我联系删除,1024@cong.zone。

在vscode中输入vue生成vue文件的模板

效果

在vscode中输入vue可以代码补全
vscode代码补全效果-1659714430558

步骤

打开vscode
新建一个vue文件
文件–>首选项—>用户代码片段
image
在弹出的搜索框中输入vue,并点击
image-1659713728444

粘贴一下内容,并保存

{
	"Print to console": {
		"prefix": "vue",
		"body": [
			"<template>",
			"<div></div>",
			"</template>",
			"",
			"<script>",
			"",
			"export default {",
			"name: '' ,",
			"components: {},",
			"props:['list'],",
			"data() {",
			"return {",
			"",
			"}",
			"},",
			"computed: {},",
			"watch: {},",
			"created() {",
			"",
			"},",
			"mounted() {",
			"",
			"},",
			"beforeCreate() {",
			"",
			"},",
			"beforeMount() {",
			"",
			"},",
			"beforeUpdate() {",
			"",
			"}, ",
			"updated() {",
			"",
			"}, ",
			"beforeDestroy() {",
			"",
			"},",
			"destroyed() {",
			"",
			"},",
			"activated() {",
			"",
			"},",
			"methods: {",
			"",
			"}",
			"}",
			"</script>",
			"<style lang='less' scoped>",
			"$4",
			"</style>"
		],
		"description": "Log output to console"
	}
}

新建一个index.vue文件
输入vue
按回车或点击
vscode代码补全效果

0

评论区