用vscode做開發時，平時所用的程式碼段比較簡潔，為了提高開發效率，我們需要自定義我們用著習慣方便的程式碼段，這裡只是以js,vue為例。

相信大家一看就明白，至於程式碼段在哪裡編寫，在這我就不多說了，大家都明白。

我們就可以自定義開發中常用的程式碼段，節省時間，大大提高開發效率。

(注意：建立哪種語言的程式碼片段就進相應語言的程式碼片段區域，寫js程式碼段就不要把程式碼段寫在了php的程式碼段編寫區)

\r\n：代表換行，填寫幾個代表換幾行，
\t：tab數，有幾個代表有幾個tab

程式碼片段

 js程式碼段：

{
    "Print to vue": {
        "prefix":"vue",
        "body": [
            "new Vue({\r\n\tel:'#app',\r\n\tdata:{\r\n\t\t$2\r\n\t},\r\n})",
        ],
        "description":"script中的vue"
    },
}
 

效果：

vue程式碼段：

{
	"Print to vue": {
		"prefix": "vue",
		"body": [
			"<template>\r\n\t$1\r\n</template>\r\n\r\n<script>\r\n\texport default {\r\n\t\tdata() {\r\n\t\t\treturn {\r\n\t\t\t\t\r\n\t\t\t}\r\n\t\t},\r\n\t}\r\n</script>\r\n\r\n<style scoped>\r\n\t$3\r\n</style>"
		],
		"description": "vue檔案的初始程式碼段"
	},
}
 

 效果：

還有一種更為直觀的寫法，更容易書寫：

雙引號需要在前面加上 \ 進行轉義

	"Print to js": {
		"prefix": "js",
		"body": [
			"<script src=\"https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js\"></script>",
    		"<script>",
        		"\t$(function() {",
					"\t\t$1",
        		"\t})",
    		"</script>"
		],
		"description": "Log output to js"
	},
 

	"Print to jsvue": {
		"prefix": "jsvue",
		"body": [
			"<div id=\"app\"></div>",
    		"<script src=\"https://cdn.bootcss.com/vue/2.5.16/vue.min.js\"></script>",
    		"<script>",
				"\tnew Vue({",
					"\t\tel: 'app',",
					"\t\tdata: {",
						"\t\t\t$1",
					"\t\t}",
				"\t})",
			"</script>"
		],
		"description": "Log output to jsvue"
	},

這兩種寫法，推薦第二種，易寫，易讀，更為直觀，不管哪種能提高效率就行