VSCode 快速生成vue代码片段

插件库中搜索Vetur,点击安装,安装完成之后点击重新加载,即可使用

 

mac的步骤如下,由于我安装了转中文插件,所以接下来会是中文的:
code -> 首选项 -> 用户代码片段 -> (新建代码片段取名vue.json)
新建代码片段这块可以直接往下找就能找到vscode上带的vue.json



{
  "Print to console": {
    "prefix": "vue",  
    "body": [
      "<!-- $1 -->",
      "<template>",
      "<div></div>",
      "</template>",
      "",
      "<script>",
      "export default {",
      "data() {",
      "return {",
      "",
      "}",
      "},",
      "//生命周期 - 创建完成(访问当前this实例)",
      "created() {",
      "",
      "},",
      "//生命周期 - 挂载完成(访问DOM元素)",
      "mounted() {",
      "",
      "}",
      "}",
      "</script>",
      "<style scoped>",
      "/* @import url(); 引入css类 */",
      "$4",
      "</style>"
    ],
    "description": "Log output to console"
  }
}



此处说明一下:"prefix": "vue", 就是快捷键,(vue名称可随意修改)
新建vue文件,输入vue 按键盘的tab件生成vue模版
posted @ 2021-10-25 16:49  何云泽  阅读(565)  评论(0)    收藏  举报