快速生成vue模版

987 阅读1分钟

由于看到团队成员都在复制粘贴代码,秉着偷懒的原则,所以给成员们提供一个快速生成vue模板的方法。

编辑器:vscode

点击项目左下角的齿轮,选择用户代码片段,可以选择全局或者vue.json

"ZCSVueTemplate": {
    // "scope": "javascript,typescript",
    "prefix": "vue",
    "body": [
      "<template>",
      "  <div class='${1:container}'>\n",
      "  </div>",
      "</template>\n",
      "<script>",
      "export default {",
      "  name: '${2:vue}',",
      "  props: {},",
      "  data() {",
      "    return {};",
      "  },",
      "  computed: {},",
      "  created() {},",
      "  methods: {},",
      "};",
      "</script>\n",
      "<style scoped lang='postcss'>\n",
      "</style>\n",
    ],
    "description": "Create vue template"
  }

其中$1,$2是光标所在位置,默认在第一位,按下tab进入$2的位置。

${1:container}中的container是默认输入

最后把次json文件放在项目根目录的 .vscode目录下,因为要团队共享

感觉效率又提高了。