vscode中自定义代码片段

自定义代码片段

设置--> 用户代码片段 --> vue.json

{
	"vc": {
		"prefix": "vc",
		"body": [
			"<template>",
			"  <div class=\"$1\">",
			" ",
			"  </div>",
			"</template>",
			" ",
			"<script>",
			"export default {",
			"  name: 'vueName',",
			"  data () {",
			"    return {",
			"      msg:'Welcome to your vueName'",
			"    }",
			"  }",
			"}",
			"</script>",
			" ",
			"<style scoped lang=\"less\">",
			" ",
			"</style>"
		],
		"description": "vue组件模板"
	},
	"vcts": {
		"prefix": "vcts",
		"body": [
			"<template>",
			"  <div class=\"componentContainer\">",
			"",
			"  </div>",
			"</template>",
			"",
			"<script lang=\"ts\">",
			"import { Component, Prop, Vue } from 'vue-property-decorator'",
			"@Component({",
			"  components: {",
			"",
			"  }",
			"})",
			"export default class $1 extends Vue {",
			"  @Prop() private msg!: string;",
			"  created () {",
			"    console.log('created')",
			"  }",
			"}",
			"</script>",
			"",
			"<style scoped lang=\"less\">",
			" .componentContainer{",
			"",
			" }",
			"</style>",
			""
		],
		"description": "vue组件模板"
	}
}

猜你喜欢

转载自www.cnblogs.com/nanhuaqiushui/p/12727464.html