VScode 新建vue文件 生成自定义模版并添加注释

在新建文件时, 输入vue直接生成了默认的模版, 那么可不可以生成自定模板呢, 在模板中添加一些自己想要的内容, 比如注释, 作者, 生成时间等, 答案当然是可以的.

1, VSCode: ctrl + Shift + P 输入 Snippets, 选择Snippets

截屏2022-10-11 11.16.23.png

2, 输入vue, 选择vue.json文件

截屏2022-10-11 11.18.17.png

3, 在vue.json文件输入内容, 这里是定义了一个快捷语, 下面还有定义多个的

 {
    "vue": {
        "prefix": "vue",
        "body": [
            "",
            "",
            "",
            "",
            "",
            "",
            "",
        ],
        "description": "vue初始化页面"
    }
}

4, vue.json 语法释义

在vue.json中可以定义多个快捷语法,快捷语法的key一般和prefix名字相同, 定义每个快捷语法包含三个部分: prefix, body, description

• prefix 表示调用模版时输入的名字
• body 表示快捷语法的具体内容
• description 表示快捷语法的描述, 是用来做什么的, 可以根据含义来写

编写body内容时语法示意

"": 表示一个空行, 双引号中的内容会原版的显示出来, 如果有缩进, 就要在双引号中打出来, 每个双引号后面都要以","结尾.

5, 在vue.json中定义多个快捷语法

 {
    "vue": {
        "prefix": "vue",
        "body": [
            "",
            "",
            "",
            "",
            "",
            "",
            "",
        ],
        "description": "vue初始化页面"
    },
    "///": {
        "prefix": "///",
        "body": [
            "",
        ],
        "description": "快捷生成注释模版"
    },
}