vscode自定义vue模板

1、打开file->preferences->User snippets,输入vue.json,添加下面代码。

2、新建vue文件，输入vue回车，补全为vue2.0语法，输入v3回车，补全为vue3.0语法

 
{
	"Print to console": {
	    "prefix": "vue",
	    "body": [
	      "<template>",
	      "  <div >\n",
	      "  </div>",
	      "</template>\n",
	      "<script>",
	      "export default {",
			  "  name: '',",
		    "  components: {},",
	      "  data() {",
	      "    return {\n",
	      "    }",
	      "  }",
	      "}",
	      "</script>\n",
	      "<style>",
	      "</style>",
	      "$2"
	    ],
	    "description": "Log output to console"
	  },

	  "Printf to console": {
		  "prefix": "v3",
		  "body": [
		    "<template>",
		    "  <div >\n",
		    "  </div>",
		    "</template>\n",
		    "<script>",
	        "import { reactive } from '@vue/composition-api'\n",
		    "export default {",
			"  name: '',",
			"  components: {},",
			"  setup (propes, { root }) {",
			"    const model = reactive(",
			"      {}",
			"    )\n",
		    "    return { model }",
		    "  }",
		    "}",
		    "</script>\n",
		    "<style>",
		    "</style>",
		    "$2"
		  ],
		  "description": "Log output to console"
		}
  }

同理，生成 js 代码块，需要在 javascript.json里添加，比如在<script></script> 里面输入 .then  ，可以自动成成一下代码

"Print to console": {
		"prefix": ".then",
		"body": [
			".then(res=>{",
			    "console.log(' ~ res:', res)",
			"})",
			".catch(err => {",
				  "console.log(' ~ err:', err)",
			"})",
			"$2"
		],
		"description": "promise"
	},