前端代码编码规范---编码规范+统一插件+常用技巧

于 2025-03-24 08:35:03 发布
阅读量129 收藏
点赞数 1
CC 4.0 BY-SA版权
文章标签： 前端 javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/tusofthappy/article/details/146466941

【常用模版】
（1）代码格式化插件+配置+默认模版
Prettier - Code formatter


【常用技巧】

（1）快速增加控制台调试日志的插件Turbo Console Log
安装Turbo Console Log插件
选中变量，按此快捷键自动生成console.log调试日志：ctrl+alt+l(L)
注释所有console.log：alt+shift+c
启用所有console.log：alt+shift+u
删除所有console.log：alt+shift+d

tuhongwu25
关注
VS Code 插件 Turbo Console Log 自定义 console.log 快速控制台输出
Demon's blog
02-02 3517
【代码】VS Code 插件 Turbo Console Log 自定义 console.log 快速控制台输出。
前端工程化之代码规范---ESLint + Prettier + husky + lint-staged代码规范全家桶
codingWeb的博客
11-07 1517
每个开发者都有自己的习惯，代码的风格也不尽相同，比如缩进的格数，结尾加不加分号,定义函数有没有空格，这些看似好像不起眼的风格，但在多人开发的时候，代码commit提交，可能就会出现一大片冲突，或者过多修改过的情况，对项目管理和维护是极其不友好的，而且在review，阅读项目代码的时候，一个项目中出现几种，甚至10几种的代码风格，我相信没人受得了这事，人都有一种惯性思维，习惯看一种风格，切换到其他风格可能需要适应一下，更别说人手一套风格的项目了，这肯定是不能接受的 ，这个问题很严重，必须得解决 ...
神器 Turbo Console Log：让 `console.log` 操作一键搞定！
Judy1623
02-06 1387
有了 Turbo Console Log 插件，调试代码变得轻松又高效。如果你还在为手动输入 console.log 而烦恼，不妨试试这款插件，相信它会成为你开发路上的得力助手！
实用vscode插件
yufengguanyun的博客
02-16 6818
1、自动帮你写console.log —— Turbo Console Log 是否每次调试程序的时候，手动写console.log让你感觉厌倦？来来来，这里有一款vscode插件适合你，他就是：Turbo Console Log。 Turbo Console Log 只要将想打印的变量选中，按住ctrl + option + L(windows: ctrl + alt + L)，就能在变量下方自动插入一个console.log： image 除此之外，该插件还支持多选插入co
基础：常用快捷键。
m0_52338152的博客
04-10 2277
IDEA常用快捷键: 查看一个类的方法：Ctrl+鼠标点击类名称 Ctrl+F12+输入要查找的方法 Alt+Enter：代码修复 Ctrl+V：删除当前光标所在行 Ctrl+D：复制当前光标所在行 Ctrl+Alt+L：格式化（让代码变整齐） Ctrl+/：单行注释 Ctrl+Shift+L：多行注释 Alt+Insert：自动生成代码 Alt+Shift+上下箭头：移动当前行 shift+F6：修改多个相同变量 鼠标选中+shift+table：整体向坐 鼠标选中+table:整.........
提速调试利器：Turbo Console Log
gitblog_00002的博客
05-20 1863
提速调试利器：Turbo Console Log 去发现同类优质开源项目:https://gitcode.com/ 在编程世界中，调试是必不可少的一环，它帮助我们理解代码的执行过程并修复问题。而有效的日志输出则是调试的关键工具。今天，我们向您推荐一个能够极大提升调试效率的VS Code扩展——Turbo Console Log。 项目简介 Turbo Console Log是一款专为JavaScr...
uni-app代码规范统一：eslint+prettier工具配置教程
描述中提到，“uni-app 的eslint 验证配置”意味着该套件专门针对 uni-app（一个使用 Vue.js 开发所有前端应用的框架）进行过配置，用以验证代码风格和规范，帮助开发者遵循统一的编码规范，减少团队协作时因代码...
vscode1.68安装及代码规范插件
06-24
`dbaeumer.vscode-eslint-2.2.3.vsix` 是ESLint的VSCode扩展，ESLint是一个静态代码分析工具，用于检测并防止JavaScript代码中的潜在错误和不符合编码规范的部分。2.2.3版本确保了与最新版ESLint的兼容性，帮助...
前端代码规范
dfc_dfc的博客
07-27 847
前端开发规范分享
uni-app项目 - 第二集 首页全局样式+轮播图练习 (vscode+vue3+ts 附代码)
最新发布
05-24
uni-app是一个使用Vue.js开发所有前端应用的框架，它允许开发者编写一次代码，然后发布到iOS、Android、Web（包括微信小程序）等平台。它提供了丰富的组件和API，并且遵循Vue.js的开发规范，使得Vue开发者能够快速...
turbo-console-log
05-01
主要功能 通过自动执行写有意义的日志消息的操作，此扩展使调试变得更加容易。 特征 I）自动插入有意义的日志消息 两步： 选择作为调试主题的变量 按Ctrl + Alt + L 相对于所选变量，日志消息将插入到下一行，如下所示： console.log（“ SelectedVariableEnclosingClassName-> SelectedVariableEnclosingFunctionName-> SelectedVariable”，SelectedVariable） 多光标支持： 特性： turboConsoleLog.wrapLogMessage（布尔值）：是否包装日志消息。 turboConsoleLog.logMessagePrefix（字符串）：日志消息的前缀（默认为 :rocket: ）。 turboConsoleLog.addSemicolonInTheEnd（布尔
工欲善其事必先利其器 vsode常用设置
小白努力走
06-27 1047
mock数据： mock 是基于 浏览器代理加node代理实现的。 本地start后自动启动一个端口为8989的proxy server。浏览器通过代理（我使用的是switchy omega）代理到8989的服务器，然后8989服务器读取本地proxy.config.js的配置完成转发。假设mock serverIP为3.23.1.1。设置proxy.config.js进行转发 module.e
强烈推荐vsCode插件、自动生成console.log
Bright2017的博客
03-31 3188
页面原本存在的console不会被删除 (
VSCode插件（备忘）
So.九天
12-24 667
vscode插件
Turbo Console Log自定义配置
NanChen的博客
06-13 1858
因为vscode的其他快捷键可能会和这个插件产生冲突，所以可以从这里设置自定义不重复的快捷键。可以用下vscode中的。还有其他的设置可以参考这篇文档。我用的是显示第多少行和路径名。
VSCode设置console.log()快捷键方法
lwenl的博客
04-13 4657
一、打开vscode,选择文件–首选项–用户代码片段 二、选择javascript类型，打开javascript.json文件 三、按照操作，设置快捷输入 “Print to console”: { “prefix”: “log”, “body”: [ “console.log(’$1’);”, “$2” ], “description”: “Log output to console” } [C...
VSCode 推荐插件之Turbo Console Log插件
李子玅
12-06 2761
设置项描述默认值日志信息的前缀🚀日志信息的后缀logType打印日志的类型log当指定的logType属性将被忽略时，在插入的日志信息中使用的自定义日志函数日志信息的分隔号quote双引号或单引号是否在日志信息代码末尾加分号true是否在日志消息中插入所选变量的当前Class类名true是否在日志信息中插入所选变量的函数true是否在日志消息中插入文件名和行号true是否在日志信息上下增加一行以横线分割的日志true是否在日志信息代码前插入空行true。
vscode 插件
weixin_41640571的博客
05-29 484
1、turbo console log 快捷添加 console.log，一键 注释 / 启用 / 删除 所有 console.log。这也是我最常用的一个插件
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值