本篇文章给大家介绍一下vscode中有用的插件。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
/2021/04/da871619.jpg
Python
提供了代码分析，高亮，规范化等很多基本功能
/2021/04/11762688.png" alt="python
vscode-icons
各种漂亮图标
/2021/04/2a93b838.png" alt="vscode-icons
点击这里设置图标
/2021/04/f522ff56.png" alt="点击这里设置图标
然后选vscode-icons
/2021/04/46569bc2.png" alt="选择 vscode-icons
filesize
左下角显示文件大小的插件
/2021/04/c681dc33.png" alt="filesize
/2021/04/dc7bc817.png" alt="filesize显示效果
Bracket Pair Colorizer
成对的彩色括号 /2021/04/dc7bc817-1.png" alt="彩色括号
Settings Sync
可以同步 VS Code设置同步到 GitHub 账号，包括 setting 文件和插件设置等等，重新配置VS Code的时候只需同步一下即可。安装完成后，只需要新增一个Github token，添加后，剩下的根据个人喜好进行配置，其他的插件自动帮你完成。
/2021/04/87e248e7.png" alt="Settings Sync
这里需要说一下的是很多不负责任的博文在选择 token权限的时候说让全选，其实是很危险的行为。我一开始也感觉哪里怪怪的，因为要安装的插件很多，也没有太细究，直到我需要在另一台电脑上同步VS Code 设置的时候，点开了 Setting Sync 的官网看了看才发现，哪里需要那么多权限，只需要一个权限就好。如下图
/2021/04/f1203552.png" alt="Setting Sync
Atom-Material
一款安卓风的颜色主题，推荐使用推荐的字体设置。
"editor.fontSize": 16, "editor.fontWeight": "400", "editor.lineHeight": 24, "editor.letterSpacing": 0.5
/2021/04/c54ec775.png" alt=" Atom-Material
推荐设置的显示效果
/2021/04/689def8c.png" alt="设置后的显示效果
Path Autocomplete
自动感知目录下的文件，自己选择就好。
注意： VSCode本身也支持路径的感知，需要配置好用系统自带的还是用这个插件，否则，每个路径下的条目都会有两份。
/2021/04/c42d3756.png" alt="Path Autocomplete
8. Import Cost
在行尾显示导入的包的大小
这个好像只支持JavaScript。
/2021/04/dc219a70.png" alt="Import Cost
Indent-Rainbow
带颜色的缩进
/2021/04/f08ccc21.png" alt="Indent-Rainbow
缩进效果
/2021/04/99e73536.png" alt="锁紧效果
GitLens
能显示每一行代码的作者以及提交时间。
/2021/04/2e476c10.png" alt="GitLens
效果
/2021/04/c961f4d8.png" alt="GitLens使用效果
Git history
Git 历史
/2021/04/0030cd77.png" alt="Git History
Color Highlight
直观显示在 css/web 中定义的颜色
/2021/04/253d0e4a.png" alt="Color Hightlight
Quokka.js
实时执行 JavaScript 代码(做快速的 demo 很有用)
src="80c463848a00e57d2ae578d4b5a79bf4-22.png" alt="Quokkia.js
Code Runner
立刻运行代码
src="80c463848a00e57d2ae578d4b5a79bf4-23.png" alt="Code Runner
Vetur
Vue 工具插件
src="80c463848a00e57d2ae578d4b5a79bf4-24.png" alt="Vetur
Live server
实时显示网页情况
src="3849de74bad394b64a0371f10d425bb4-25.png" alt="Live server
Python indent
自动纠正 Python 缩进
src="3849de74bad394b64a0371f10d425bb4-26.png" alt="Python Indent
vscode-fileheader
头部注释添加/更新插件
src="cea4c427fd014b43eb89d3d4b83901df-27.png" alt="vscode-fileheader
TODO Highlight
高亮显示备注中的 TODO 事项，推荐配合 第19个插件， Todo Tree 使用
src="cea4c427fd014b43eb89d3d4b83901df-28.png" alt="TODO Highlght
Todo Tree
点击左侧栏“树”的logo，显示 TODOList 条目，点击相应的条目，可以打开文件并定位到 TODO 行。
src="11a40005c299af43a79ff48e7ea55dac-29.png" alt="
Auto Close Tag
自动写关闭标签的插件
src="11a40005c299af43a79ff48e7ea55dac-30.png" alt="在这里插入图片描述
Auto Rename Tag
自动重命名关闭标签
src="518eb6c93ca3fb28b7449dbc5f08e000-31.png" alt="Auto Rename Tag
Polacode
代码段生成图片
src="518eb6c93ca3fb28b7449dbc5f08e000-32.png" alt="Polacode
Guides
比 VS Code自带的更好的参考线，可自定义
src="2650c25230b9da5c788957431df4435e-33.png" alt="Guides
Color Info
显示css中的颜色属性信息
src="8777c5e585870c016ffea212efeb61d3-34.png" alt="Color Info
Regex Previewer
正则结果预览插件
src="8777c5e585870c016ffea212efeb61d3-35.png" alt="Regex Previewer
Mithril Emmet
注意：其实vscode 内置了Emmet插件
高效编写 HTML、CSS 代码的插件，能快速输入大部分内容
src="ab0f25c05ab921ec3551ba5d665700a1-36.png" alt=" Mithril Emmet
比如，在编辑 HTML 文件时，输入tr*2>td*3，然后回车，就能快速生成一个两行三列的表格标签。
src="ab0f25c05ab921ec3551ba5d665700a1-37.png" alt="在这里插入图片描述
src="c769f6f38c0eaed270e1951dd7e6e15d-38.png" alt="在这里插入图片描述
推荐学习：《vscode教程》
以上就是推荐二十七个vscode有用插件，一起安装吧！的详细内容，更多请关注北冥有鱼其它相关文章！
本文转载自【PHP中文网】，希望能给您带来帮助，苟日新、日日新、又日新，生命不息，学习不止。
