5

具体步骤如下:

1、使用command + Shift + P召唤出控制台,然后输入snippets(跟着自动提示走就行了)并选择。

2、接下来输入vue并选择,VSCode会自动生成一个vue.json的文件。这里就是我们要输入模板的地方了。

3、输入模板,具体格式如下(这是我用的格式,当然也可根据自己的喜好进行修改)其中$0代表模板生成后,光标停留的位置。

{
// Place your snippets for vue here. Each snippet is defined under a snippet name and has a prefix, body and 
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
// same ids are connected.
// Example:
"Print to console": {
    "prefix": "vue",
    "body": [
        "<template>",
        "  <div class=\"\">$0</div>",
        "</template>",
        "",
        "<script>",
        "export default {",
        "  components:{},",
        "  data(){",
        "    return {",
        "    }",
        "  },",
        "  created(){},",
        "  mounted(){}",
        "  watch:{},",
        "  computed:{},",
        "  methods:{},",

        "}",
        "</script>",
        "<style lang=\"scss\" scoped>",
        "</style>"
    ],
    "description": "A vue file template"
}

}

4、创建一个.vue 文件,然后输入“vue”,点击“tab”即可生成模板。

tips:

在vscode中使用插件是注意项:不要使用:IntelliSense for CSS, SCSS class names in HTML and Slim这个插件,他会和tab的自动补全冲突的。
图片描述


Miss_Ye
1.5k 声望157 粉丝

知识的价值不在于占有,而在于使用!