相思资源网 Design By www.200059.com

使用VScode的用户代码片段功能,来生成自己习惯的代码模板,提升开发效率

1.选择菜单里的 文件 > 首选项 > 用户代码片段

在VScode中创建你的代码模板的方法

2.选择你需要自定义模板的文件,以vue为例

在VScode中创建你的代码模板的方法

3. 配置对应文件json

把代码片段写在json里。每个代码段都是在一个代码片段名称下定义的,并且有prefix、body和description。prefix是用来触发代码片段的。使用 $1,$2 等指定光标位置,这些数字指定了光标跳转的顺序,$0表示最终光标位置。

{
 "vue-template": {
  "prefix": "vue",
  "body": [
   "<template>",
   " <div class=\"$1\">",
   "",
   " </div>",
   "</template>",
   "",
   "<script>",
   "export default {",
   " name: '$1',",
   " data() { ",
   "  return {",
   "",
   "  }",
   " }",
   " }",
   "</script>",
   "",
   "<style lang=\"\" scoped>",
   " .$1{",
   "",
   " }",
   "</style>"

  ],
  "description": "my vue template"
 }
}

还有更复杂的用法…一般也用不到,我就不在这里写了。

标签:
VScode创建代码模板,VScode创建模板

相思资源网 Design By www.200059.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
相思资源网 Design By www.200059.com

评论“在VScode中创建你的代码模板的方法”

暂无在VScode中创建你的代码模板的方法的评论...