VS code 中 vue 组件模板配置

2019-05-25  本文已影响0人  梦不成

新建 vue 文件 输入tplv 后按tab键 一键生成常用vue组件

其中 prefix 选项的值可以随自己的喜好自己设置快捷键

其中 \t 表示一个table的缩进

export default 中的选项可以参考已有的配置自己添加

{
    "Print to vue-template": {
        "prefix": "tplv",
        "body": [
            "<!-- 组件说明 -->",
            "<template>",
            "\t<div class=''>\n\t\t$2\n\t</div>",
            "</template>",
            "",
            "<script>",
            "\t//import x from ''",
            "\texport default {",
            "\t\tcomponents: {",
            "\t\t\t",
            "\t\t},",
            "\t\tdata () {",
            "\t\t\treturn {",
            "\t\t\t\t",
            "\t\t\t}",
            "\t\t},",
            "\t\tcomputed: {",
            "\t\t\t",
            "\t\t},",
            "\t\tmethods: {",
            "\t\t\t",
            "\t\t},",
            "\t}",
            "</script>",
            "",
            "<style lang='scss' scoped>",
            "//@import url($3)",
            "\t",
            "</style>"
        ],
        "description": "tplv output to vue-template"
    }
}
上一篇 下一篇

猜你喜欢

热点阅读