VScode设置代码片段

最新推荐文章于 2025-04-02 09:52:30 发布

weixin_41927871

最新推荐文章于 2025-04-02 09:52:30 发布

阅读量639

点赞数

原文链接：https://blog.youkuaiyun.com/s_y_w123/article/details/86481509

版权

REACT为例

①：找到VSCode里的左上角的文件，然后点击，找到列表里的首选项，在首选项里会看到用户代码片段

②：然后进行设置，自己的代码片段。
下面我以react为例进行解释。（直接从上面第②步开始）https://blog.youkuaiyun.com/s_y_w123/article/details/86481509
大家如果想看Vue的可以看这篇博客

在这里插入图片描述

最后把下面的代码拷贝进去，Ctrl+S保存就好了

{
	"Print to console": {
        "scope": "javascript,typescript",
        "prefix": "react",
        "body": [ 
            "import React, { Component } from 'react'",
            "export default class ClassName extends Component {",
                "constructor(props) {",
                    "super(props);",
                    "this.state = {}",
                "}",
                "render() {",
                    "return (<div></div>);",
                "}",
            "}", 
        ],
        "description": "Log output to console"
    }
}

最后怎样使用呢

直接在你建的jsx文件中react+Tab键就OK啦！

效果图 ↓
在这里插入图片描述