【VS Code】VsCode常用插件

本文介绍如何通过配置VSCode的自动保存、代码格式化、中文语言包、语法高亮、智能感知、浏览器预览等功能,提升开发效率。涵盖Beautify、Vetur、EsLint、viewinbrowser、Debugger for Chrome等插件的使用技巧。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Beautify

用于格式化代码,在vscode的设置文件中添加如下代码,失去焦点保存和保存自动格式化代码

{
    "files.autoSave": "onFocusChange",
    "editor.formatOnSave": true
}

Chinese (Simplified) Language Pack for Visual Studio Code

vscode中文语言包

Vetur

语法高亮、智能感知、Emmet等。包含格式化功能, Alt+Shift+F (格式化全文),Ctrl+K Ctrl+F(格式化选中代码,两个Ctrl需要同时按着)

EsLint

语法纠错


view in browser

如何用浏览器预览运行html文件


Debugger for Chrome

映射vscode上的断点到chrome上,方便调试(配置有点麻烦,其实我没用这个)

Auto Close Tag

自动闭合HTML/XML标签

Auto Rename Tag

自动完成另一侧标签的同步修改

JavaScript(ES6) code snippets

ES6语法智能提示以及快速输入,除js外还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间

Code Runner

直接运行js代码

### Visual Studio Code 常用插件推荐 #### 文件图标增强 为了提升文件识别效率,`vscode-icons` 提供了丰富的图标来区分不同类型的文件,在资源管理器中展示更直观的视觉效果[^1]。 #### 编程语言支持与工具链完善 对于从事C/C++开发工作的用户而言,有几款不可或缺的辅助工具。首先是官方提供的 `C/C++` 扩展包,它能提供智能感知、调试配置等功能;其次是 `C/C++ Snippets` 和 `C/C++ Advanced Lint` ,前者通过预定义片段加速编码过程,后者则帮助开发者发现潜在错误并优化代码质量[^2]。 #### 开发效率提升类插件 - **Code Runner** 支持多种编程语言的一键执行功能,极大地方便了测试短小脚本或学习新语言时的需求。 - **Include AutoComplete** 可以为C/C++项目中的#include语句提供自动完成建议,减少手动输入的工作量。 - **Rainbow Brackets** 使用不同的颜色标记嵌套的大括号,使复杂的逻辑结构更加清晰易读。 - **One Dark Pro** 是一款美观的主题方案,适合长时间面对屏幕工作的人群使用。 - **GBKtoUTF8** 解决了部分中文环境下字符集转换的问题,确保源码文件能够正确解析和显示汉字内容。 - **CompareIt** 实现了便捷的文件对比操作,适用于版本控制前后的差异审查场景。 - **DeviceTree** 针对嵌入式系统工程师设计,提供了DTS/DTSI文件的支持。 - **TabNine** 利用了人工智能技术实现高效的代码预测填充机制,显著提高了编写速度和准确性。 #### 特定领域应用拓展 针对特定应用场景下的需求,还有如下几个值得考虑的选择: - 对于Web前端工作者来说,`HTML Class Suggestions` 能够依据当前使用的CSS框架动态给出合适的class选项提示[^4]; - 如果涉及到PHP项目的维护,则可借助 `PHP Intelephense` 来获得专业的语法分析以及重构指导服务[^3]。 ```json { "recommendations": [ "ms-vscode.cpptools", " formulahendry.code-runner", "eamodio.gitlens" ] } ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值