vs code中通过设置snippets代码片段 快速生成html5,vue模板

时间:2025-01-24 14:53:43
{ // 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": [ // "('$1');", // "$2" // ], // "description": "Log output to console" // } "Init vue": { "scope": "vue", "prefix": "vue", "body": [ "<!-- $1 -->", "<template>", "\t<div class='$2'>$5</div>", "</template>", "", "<script>", "", "export default {", "\tname: '$3',", "\tcomponents: {},", "\tdirectives: {},", "\tfilters: {},", "\tmixins: {},", "\tmodel: {},", "\tprops: {},", "\tdata () {", "\t\treturn {", "", "\t\t}", "\t},", "\tcomputed: {},", "\twatch: {},", "\tbeforeCreate () {},", "\tcreated () {", "", "\t},", "\tbeforeMount () {},", "\tmounted () {", "", "\t},", "\tbeforeUpdate () {},", "\tupdated () {},", "\tactivated () {},", "\tdeactivated () {},", "\tbeforeDestroy () {},", "\tdestroyed () {},", "\t// 方法集合", "\tmethods: {", "", "\t}", "}", "</script>", "<style rel='stylesheet/less' lang='less' scoped>", "//@import url($4);", "</style>" ], "description": "my vue template" } }