vsCode新建vue模板

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