VS code 中 vue 组件模板配置

新建 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"
    }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容