VScode sets template code for Vue files

VScode sets template code for Vue files

(1)\Install Veturand VueHelperplug-ins, you need to restart after the installation is complete VScode.

(2) Find the following two plug-ins, Vetur and VueHelper, in the extension plug-in search box. Pay attention to the icons and be sure not to install the wrong plug-in.

(3) Add template code snippets for vue.


(4) Select the vue item.


(5) Add your template code snippet to the opened vue.json.

{
    
    
	"vue": {
    
    
	"prefix": "vue",
	"body": [
      " <!-- @description:$0  -->",
      " <!--  @date:Created in   ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND} -->",
      " <!--  @modified By:  -->",
      " <!--  @version: 1.0.0  -->",
		"<template>",
		"  <div>",
		"  </div>",
		"</template>",
		"<script>",
      " export default {",
      "   name: '$0',",
      "   data() {",
      "     return {}",
      "  },",
      "  methods: {}",
      "}",
		"</script>",
		"<style scoped lang='scss'>",
		"</style>",
	],
	"description": "generate a vue file"}
}

(6) In the vue file, when you type the vue prefix, it will automatically think of the code snippet description you created earlier. At this time, press the Tab key or select it, and the template code snippet will be automatically added to your vue in the file.

Guess you like

Origin blog.csdn.net/weixin_44885062/article/details/121996630