【H5好程序员】vscode前端插件推荐

在这里插入图片描述

一、翻译

1.Chinese (Simplified) Language Pack for Visual Studio Code

在这里插入图片描述

2.翻译(英汉词典)

在这里插入图片描述
在这里插入图片描述

3.驼峰翻译助手

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

二、编辑器、代码美化

1.vscode-icons

在这里插入图片描述
在这里插入图片描述

2.Output Colorizer

在这里插入图片描述
在这里插入图片描述

3.Bracket Pair Colorizer 2

在这里插入图片描述
在这里插入图片描述

4.Prettier - Code formatter

在这里插入图片描述
在这里插入图片描述

// 每个制表符占用的空格数
	"prettier.tabWidth": 4,
	// 使用制表符(tab)缩进,换行显示箭头而非4个点
	"prettier.useTabs": true,

5.CSScomb

在这里插入图片描述
1.位置属性(position, top, right, z-index, display, float等)
2.大小(width, height, padding, margin)
3.文字系列(font, line-height, letter-spacing, color- text-align等)
4.背景(background, border等)
5.其他(animation, transition等)
在这里插入图片描述
在这里插入图片描述

6.Trailing Spaces

在这里插入图片描述
在这里插入图片描述

7.Time Master

在这里插入图片描述
在这里插入图片描述

三、前端必备插件,提高代码效率300%

1.Live Server

在这里插入图片描述
4种打开浏览器的方法
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

// afterDelay: 将在配置的 "#files.autoSaveDelay#"(默认1000ms) 后自动保存未保存的编辑器。
	"files.autoSave": "afterDelay",

在这里插入图片描述

2.Code Runner

在这里插入图片描述
在这里插入图片描述

3.CSS Peek

在这里插入图片描述
在这里插入图片描述

4.Image preview

在这里插入图片描述
在这里插入图片描述

四、vscode设置优化

1.自动识别打开文件的字符集编码

在这里插入图片描述

// 启用后,将在文件打开时尝试猜测字符集编码。可以按语言对此项进行配置。
	"files.autoGuessEncoding": true,

2.vscode自带的Monokai主题

在这里插入图片描述
在这里插入图片描述

// 指定用在工作台中的颜色主题。
	"workbench.colorTheme": "Monokai",

五、软件推荐

1.quicker

快捷的鼠标工具合集
在这里插入图片描述
在这里插入图片描述

  • 10
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 12
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Q星宿君Q

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值