50字范文,内容丰富有趣,生活中的好帮手!
50字范文 > vscode里怎么添加vue代码片段

vscode里怎么添加vue代码片段

时间:2020-05-02 11:36:05

相关推荐

vscode里怎么添加vue代码片段

第一步

安装vscode,可以去官网下载安装

第二步

安装拓展插件vetur,Vue tooling for VS Code.

第三步

找到用户片段:文件---->首选项—>用户片段

第四步

点击新建全局代码片段,然后输入vue.json

第五步

vue.json.code-snippets文件里添加下面代码,然后保存

{// Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope// is left empty or omitted, the snippet gets applied to all languages. 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": {// "scope": "javascript,typescript",// "prefix": "log",// "body": [// "console.log('$1');",// "$2"// ],// "description": "Log output to console"// }"Print to console": {"prefix": "vue","body": ["<template>","\t<div class=''>\n\t\t$1\n\t</div>","</template>","","<script>","export default {","\tdata () {","\t\treturn {","\t\t\t$2","\t\t};","\t},","\tcomponents: {","\t\t$2","\t},","\tcreated() {","\t\t$2","\t},","\tmounted() {","\t\t$2","\t},","\tmethods: {","\t\t$2","\t},","};","</script>","","<style lang='scss' scoped>","","</style>"],"description": "vue output to vue-template"}}

第六步

新增一个文件.vue,然后输入vue然后按tab

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。