1，shift+ctrl+X打开扩展工具，在搜索框搜索vetur，下载vetur插件，安装并重启；
1566983495(1).jpg
2，文件 --> 首选项 --> 用户代码片段 --> 输入vue，选择vue.json
3，适用于vue2的模板。复制代码到vue.json，并且保存
{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
" <div class=\"page\">\n",
" </div>",
"</template>\n",
"<script type=\"text/ecmascript-6\">",
"export default {",
"name: \"page\",",
"components: {",
"},",
"data () {",
"return {\n",
"}",
"},",
"props: {\n",
"},",
"watch: {\n",
"},",
"methods: {\n",
"},",
"computed: {\n",
"},",
"created () {\n",
"},",
"mounted () {\n",
"},",
"destroyed () {\n",
"},",
"}",
"</script>\n",
"<style scoped lang=\"scss\">",
"</style>",
"$2"
],
"description": "Log output to console"
}
}
4，适用于vue+ts的模板
{
"Print to console": {
"prefix": "vue3",
"body": [
"<template>",
" <div class=\"${TM_FILENAME_BASE}_box\"></div>",
"</template>",
"",
"<script lang='ts'>",
"import { Vue, Component, Prop, Watch } from 'vue-property-decorator';",
"import { State } from 'vuex-class';",
"import Axios from 'axios';",
"interface ${TM_FILENAME_BASE}list {}",
"@Component({})",
"export default class ${TM_FILENAME_BASE} extends Vue {",
"public async mounted(): Promise<void> {",
"}",
" }",
"</script>",
"<style scoped lang=\"less\">",
"</style>",
],
"description": "Log output to console"
}
}
5，新建一个vue项目,然后输入vue回车，OK完事。
1566983958(1).jpg
