vscode设置vue模板_vscode怎么创建vue项目

大家好，又见面了，我是你们的朋友全栈君。

今天偶然间被朋友问到 ： 你的 VSCode 配置代码片段了没有 ？

我 ？ 啥代码片段 ？ 是 Vue 的快捷模板代码么 ？

因为公司是内网开发环境 ， 许多 VSCode 好用的插件下不了 ，

所以就得自己进行一下配置了 ， 当然这个问题下载几个插件也可解决：

• Vetur

• Vue 3 Snippets

• Vue VSCode Snippets

OK ， 那既然这样的话 ， 有需求 ， 咱们就开整 ：

前端行业使用的编辑器有很多，比如 VSCode 和 webStorm ，其中在创建 vue 文件后webStorm 可以自动生成相关的代码，而在 VSCode 中得一个一个的敲，这样既浪费时间又效率低 ，因此，在 VSCode 中可以一键生成 vue 模板吗 ？当然可以，过程如下： 1、打开 VSCode 编辑器 2、左上角 文件(F) => 首选项 => 用户片段 3、在出现的框中输入 vue 之后按回车键 4、在出现的 vue.json 文件内写入以下代码

{
  "vb": {
    "prefix": "vb",
    "body": [
      "<template>",
      "  <div></div>",
      "</template>",
      "",
      "<script>",
      "export default {",
      "  name: '',",
      "  data() {",
      "    return {",
      "    };",
      "  },",
      "  computed:{",
      "  },",
      "  watch:{",
      "  },",
      "  methods: {},",
      "};",
      "</script>",
      "",
      "<style scoped>",
      "",
      "</style>",
      ""
    ],
    "description": "vb components"
  }
}

复制上面的代码，在相应的 vue 文件中输入 vb 之后回车，就会生成 vue 模板 效果如下图所示：

好啦，vue 模板就生成了，是不是很简单呢 ✌️ ✌️ ✌️

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/196516.html原文链接：https://javaforall.cn