美文网首页
VScode用户代码片段,快速生成vue片段

VScode用户代码片段,快速生成vue片段

作者: 後弦月的雨 | 来源:发表于2020-11-19 15:06 被阅读0次

    1、打开vscode, 文件-首选项-用户代码片段,选择代码片段文件或创建代码片段,选择或新建vue.json

    image.png

    2、输入以下代码:当你输入vue的时候,可以快速生成代码片段

    备注:配置没有生效重启软件

    {
          "Print to console": {
              "prefix": "vue",
              "body": [
                  "<template>",
                  "  <div>\n",
                  "  </div>",
                  "</template>\n",
                  "<script>",
                  "export default {",
                  "  props: {\n",
                  "  },",
                  "  components: {\n",
                  "  },",
                  "  data() {",
                  "    return {\n",
                  "    };",
                  "  },",
                  "  computed: {\n",
                  "  },",
                  "  watch: {\n",
                  "  },",
                  "  created() {\n",
                  "  },",
                  "  mounted() {\n",
                  "  },",
                  "  methods: {\n",
                  "  },",
                  "};",
                  "</script>\n",
                  "<style scoped lang=\"${1:less}\">\n",
                  "</style>\n",
              ],
              "description": "Create vue template"
          }
      }
    

    3、测试:新建vue页面,输入vue显示如下

    image.png
    看到一个更全面解释的文章,需要可以参考一下(我没测试)https://www.cnblogs.com/missfox18/p/11315476.html

    相关文章

      网友评论

          本文标题:VScode用户代码片段,快速生成vue片段

          本文链接:https://www.haomeiwen.com/subject/xbxliktx.html