美文网首页
vs code 快速生成vue单页面内容

vs code 快速生成vue单页面内容

作者: Cue_Ada | 来源:发表于2019-12-18 14:47 被阅读0次

    第一步:在vs code中安装好Vetur


    image.png

    第二步:点击 文件->首选项->用户代码片段,输入vue,打开vue.json文件


    image.png
    第三步:
    编辑、保存
    {
        "Print to console": {
            "prefix": "vue",  
            "body": [
                "<template>",
                "  <section>$0</section>",
                "</template>",
                "",
                "<script scoped>",
                "export default {",
                "data(){",
                "return{}",
                "},",
                "components:{}",
                "}",
                "</script>",
                "",
                "<style scoped>",
                "",
                "</style>"
            ],
            "description": "Log output to console"
        }
    }
    

    第四步:测试,随便新建一个vue文件,输入vue,右侧可见


    image.png

    选中

    image.png

    就会快速生成简单的vue单页面内容
    ps:可根据个人习惯,再json文件中再加入其它常用的生命周期函数代码

    相关文章

      网友评论

          本文标题:vs code 快速生成vue单页面内容

          本文链接:https://www.haomeiwen.com/subject/mskunctx.html