VUE CLI vscode使用之快速生成组件文件结构模板

问题描述:

在我刚安装完vue脚手架后,初次使用时发现无法使用快捷生成文件结构模板


原因分析:

可能是vue.json没有配置模板


解决方案:

在vscode中配置vue.json

 

注意:这里输入vue后回车,会自动弹出vue.json界面。之后直接输入下面代码!!!

{
    "Print to console": {
        "prefix": "vue",
        "body": [
            "<template>",
            "    <div class=\"\">\n",
            "    </div>",
            "</template>\n",
            "<script>",
            "export default {",
            "    name: '',",
            "    data() {",
            "        return {}",
            "    },",
            "    components: {",
			"        ",	
			"    },",
            "    computed: {",
			"        ",	
			"    },",
            "    mounted: {",
			"        ",	
			"    },",
            "    methods: {",
			"        ",	
			"    },",
            "}",
            "</script>\n",
            "<style scoped>",
			"",
            "</style>",
            "$2"
        ],
        "description": "Log output to console"
    }
}

到这里就完成了vue脚手架组件文件结构模板配置。

在.vue的文件中输入vue回车就会弹出模板!