Vscode设置console.log()快捷代码片段，代码快速生成，代码模板生成

迈不过友情╰ 2023-10-04 22:45 35阅读 0赞

点击文件>首选项>配置用户代码片段：

![70b412ccf3f64b92a6bc3eeb253f9849.png][]

点击一下：然后断则javascript.json![26c0a29659f442a8b32589e46fff28dc.png][]

在这里可以配置快捷键：

![772ed8c46dd94fa29059ecbffba4c4e2.png][]

配置说明：

"Print variables to console": {
            "prefix": "clog",
            "body": ["console.log($1);"],
            "description": "Log output to console"
        }

> （1）前面这个Print to console是代码的名称，**可以自己拟定的**。  
> （2）`prefix` 意思是代码的前缀，也就是**代码片段触发的关键字**，现在设置为`csl`。  
> （3）body就是代码体。  
> （4）description就是代码的描述，可以自己解释一下代码什么意思。

配置完之后，就可以通过clog 然后按一下回车：快速生成 console.log()代码了![b1cc7374db324f7e9029755590558b91.png][]

[70b412ccf3f64b92a6bc3eeb253f9849.png]: https://img-blog.csdnimg.cn/70b412ccf3f64b92a6bc3eeb253f9849.png
[26c0a29659f442a8b32589e46fff28dc.png]: https://img-blog.csdnimg.cn/26c0a29659f442a8b32589e46fff28dc.png
[772ed8c46dd94fa29059ecbffba4c4e2.png]: https://img-blog.csdnimg.cn/772ed8c46dd94fa29059ecbffba4c4e2.png
[b1cc7374db324f7e9029755590558b91.png]: https://img-blog.csdnimg.cn/b1cc7374db324f7e9029755590558b91.png

发表评论取消回复

表情：

评论列表（有 0 条评论，35人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vscode设置console.log()快捷代码片段，代码快速生成，代码模板生成

点击文件>首选项>配置用户代码片段： ![70b412ccf3f64b92a6bc3eeb253f9849.png][] 点击一下：然后断则javascript.json!

迈不过友情╰/ 2023年10月04日 22:45/ 0 赞/ 36 阅读

相关 idea自定义快捷代码生成模板

idea中使用psvm 以及sout等都经常使用，idea也支持自定义模板 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_

素颜马尾好姑娘i/ 2023年02月21日 04:51/ 0 赞/ 30 阅读

相关快速生成代码片段

在开发过程中有一写代码重复的使用，而且不能重构。可以使用代码生成管理器进行快捷键的绑定，提高开发效率。工具--》代码片段管理--》c\ --》Visual C\ 可以自

落日映苍穹つ/ 2022年12月11日 07:46/ 0 赞/ 341 阅读

相关 vsCode自定义代码片段，生成个性化代码模板

在vscode编辑器里开发代码时会发现，vscode内置了一些语言的代码片段，会在智能提示框里一起出现，帮助自动补全代码，用起来很方便。这些代码片段是通过snippets

超、凢脫俗/ 2022年11月04日 15:23/ 0 赞/ 14 阅读

相关 vscode设置vue代码片段

一、如何设置？ 1. 打开用户片段 ![clipboard.png][] 2. 选择或创建`vue.json`代码片段 ![clipb

╰+攻爆jí腚メ/ 2022年10月27日 12:18/ 0 赞/ 300 阅读

相关前端开发工具vscode如何快速生成代码片段

下面以设置React代码片段为例： 1，打开vscode工具：文件->首选项->用户片段 ![watermark_type_ZmFuZ3poZW5naGVp

深碍√TFBOYSˉ_/ 2022年10月10日 04:53/ 0 赞/ 254 阅读

相关 VScode中Vue快速生成代码片段

首先我们要找到设置（如下图）用户代码片段 ![20181106100412594.png][] 然后我们会看到这样一个框，然后搜索html.json ![20181106

素颜马尾好姑娘i/ 2022年04月18日 00:46/ 0 赞/ 663 阅读

相关 VScode用户代码片段——快速生成vue片段

在VScode编译器中，Ctrl + Shift + p 输入：preferences:configure User Snippets ![2019032109073721

偏执的太偏执、/ 2022年03月06日 14:58/ 0 赞/ 430 阅读

相关 vscode创建vue快捷代码片段

（1）打开文件首选项 —> 用户代码片段 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ib

迷南。/ 2022年02月03日 00:55/ 0 赞/ 506 阅读

相关 vscode 快速生成React代码块

1、安装插件 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0

悠悠/ 2021年08月29日 18:41/ 0 赞/ 644 阅读