zoukankan      html  css  js  c++  java
  • 前端学习笔记系列一:7 在vscode中根据vue等模板生成代码

    目标:希望每次新建.vue文件后,VSCODE能够根据配置,自动生成我们想要的内容。

    方法:打开VSCODE编辑器,依次选择“文件 -> 首选项 -> 用户代码片段”,此时,会弹出一个搜索框,输入vue

    选择vue后,VSCODE会自动打开一个名字为vue.json的文件,复制以下内容到这个文件中:

    "Print to console": {

        "prefix": "vue",

        "body": [

          "<!-- $0 -->",

          "<template>",

          "  <div></div>",

          "</template>",

          "",

          "<script>",

          "export default {",

          "  data () {",

          "    return {",

          "    };",

          "  },",

          "",

          "  components: {},",

          "",

          "  computed: {},",

          "",

          "  mounted: {},",

          "",

          "  methods: {}",

          "}",

          "",

          "</script>",

          "<style lang='scss' scoped>",

          "</style>"

      ],

        "description": "Log output to console"

      }

    保存后关闭,$0 表示你希望生成代码后光标的位置 ; prefix 表示生成对应预设代码的命令。

    使用demo:新建一个名为demo.vue的文件,输入vue按下enter,就会自动生成内容啦。

    <!--  -->

    <template>

      <div></div>

    </template>

     

    <script>

    export default {

      data () {

        return {

        };

      },

     

      components: {},

     

      computed: {},

     

      created() {},

     

      mounted() {},

     

      methods: {}

    }

    </script>

     

    <style lang='scss' scoped>

    </style>

    后记,当然,你也可以为.js、.html等各种文件预设代码片段。

    见贤思齐,见不贤而自省
  • 相关阅读:
    Argparse4j
    Socket通信中的 BeginReceive与EndReceive
    socket 异步通信的一些问题
    static 还是readonly 还是static readonly
    隐藏Android下的虚拟按键
    IIS上架设https网站证书处理备忘
    [转] 移动平台Html5的viewport使用经验
    Air File.load加载问题
    x64位windows 2003 server中“Server 对象 错误 'ASP 0177 : 800700c1' Server.CreateObject 失败”问题
    报 "错误: 无法取消引用int" 的问题解决纪录
  • 原文地址:https://www.cnblogs.com/Sweepingmonk/p/10868370.html
Copyright © 2011-2022 走看看