VScode快速一键生成html、vue、jsx、ajax、sass、docker等代码片段

学会添加自定义snippet(代码段)就可以极大的提高你的开发效率

ajax-snippet.gif

1.文件 => 首选项 => 用户代码片段

clipboard.png

2.选择你需要新建的代码片段的语言

clipboard.png

3.进入代码片段编辑界面

1. 所有的代码片段需要用""或''包裹
2. \\t表示制表符
3. 空的一行必须用''或""包裹
4. $1代表光标第一次出现的位置,$2代表按下tab后光标第二次出现的位置

4.一个简单地.jsx demo

{
    "JSX": {
        "prefix": "jsx", // 触发的关键字 输入jsx按下tab键
        "body": [
            "import React from 'react'",
            "",// 空的一行
            "class Demo extends React.Component {",
            "\trender() {", // 有制表符的一行
            "\t\treturn (",
            "\t\t\t$1",    // 光标首次出现的位置            
            "\t\t)",
            "\t}",
            "}",
            "",
            "export default Demo",
        ],
        "description": "jsx components"
    }
}

5.demo

图片描述

备注:官方文档 https://code.visualstudio.com...

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值