📍 小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
前言
VSCode作为大部分前端程序员吃饭的工具来说是离不开(bushi 的,那么提升VSCode开发时的体验想必也是十分重要的,这里分享几个好用的插件/技巧来帮助新手程序员快速提升VSCode开发体验
1. 主题
推荐几款好看的VSCode主题
-
One Dark Pro 一款个人非常推荐使用的暗黑色主题,也是VSCode安装最多的主题之一
-
Snazzy Operator
3. Dracula Official
2. 字体
JetBrains Mono
这是一款带有连字支持的免费字体
3. icon
vscode-icons
file-icons
4. 常用快捷键
| 常用快捷键 | 用途 |
|---|---|
| Shift + Alt + F | 格式化代码 |
| Shift + Alt + ↑/↓ | 向上/下复制当前行 |
| Alt + ↑/↓ | 向上/下移动当前行 |
| Ctrl + L | 选中当前行 |
| Ctrl + ` | 打开控制台 |
| Ctrl + F | 查找 |
| Alt + N | 选中所有匹配项 |
5. Open in Browser
它可以把html文件用浏览器打开
安装完插件后在html文件中右键点击Open in Browser,就可以在默认浏览器中打开了
6. Live Server
静态服务器,为静态页面启动具有实时重载特性的本地开发服务器
7. Auto Close Tag
自动关闭标签,对于新手前端非常实用,能够自动关闭html标签
8. 终端使用vscode打开文件/文件夹
windows端:
打开文件夹:直接在目标文件目录下输入
code .
打开文件(以src下的main.js文件为例):
code src/main.js
mac端:
首先打开vscode软件。
同时按住shift + command + P打开命令面板。
找到Install ‘code' command in PATH,并执行。
9. 程序员鼓励师(彩虹屁)
🌈RAINBOW FART
这是一个在你编程时持续夸你写的牛逼的扩展,可以根据代码关键字播放贴近代码意义的真人语音。
下载并安装RAINBOW FART插件后,按住Ctrl + Shift + P打开命令面板,输入Enable Rainbow Fart并回车,在弹出的消息通知中点击Open
在打开的页面中点击授权
至此,你已经安装好了彩虹屁,在VSCode中输入function试试吧!