一、基础设置
路径:首选项
- File: Auto Save,自动保存:下拉选择 “afterDelay”,时间为 1000 (毫秒)
- Editor: Font Size,字体大小:填写 17 (编辑器字体大小)
- terminal.integrated.font Size:填写 16 (终端字体大小)
- Editor: Font Family,字体类型:再最前面追加 'YaHei Consolas Hybrid',
即 'YaHei Consolas Hybrid','Droid Sans Mono', 'monospace', monospace, 'Droid Sans Fallback' - Editor: Mouse Wheel Zoom:去掉勾选“按住Ctrl键并滚动鼠标滚轮时对编辑器字体大小进行缩放”
- 主题 -> 颜色主体:浅色(Visual Studio) Visual Studio Light
- [推]自定义VSCode左边资源管理器文件夹【缩进】距离
- 在新窗口中打开文件夹:设置 -> 窗口 -> 新建窗口 -> 找到“
Open Folders In New Window”,选择“on” - 关闭“工作区信任”功能,即以后不要弹框提示是否信任某个工作区或文件了,统统都被信任:
搜索“Trust: Enabled”,去掉勾选“控制是否在 VS Code 内启用工作区信任” - 关闭“缩略图”:文本编辑器 -> 缩略图 -> Enabled,去掉勾选“控制是否显示缩略图”
- 始终显示滚动条:文本编辑器 ->
Scrollbar: Horizontal,勾选“visible”,Scrollbar: Vertical,选择“visible” - 关闭功能“鼠标单选单词时高亮”:文本编辑器 ->
Occurrences Highlight, 去掉勾选“控制编辑器是否突出显示语义符号的匹配项目”
相关配置:
- Trae的 Breadcrumbs(面包屑)导航功能详解:Breadcrumbs
- 【VSCode/Trae】Spring Boot Java修改热更新
- 【VSCode/Trae】Prettier 如何设置,如果已经手动换行的,就不要强制在 一行了
二、快捷键设置
设置路径:首选项->键盘快捷键(搜索以下“命令”)
| 命令 | 快捷键 | 功能 |
|---|---|---|
| 【全屏】模式 | F11 | 全屏与退出全屏。全屏模式下,会隐藏掉 Windows 的任务栏,让 VSCode 窗口占满整个屏幕; |
| 触发建议 | Alt + / | 代码提示 |
| 快速修复 | Alt + Enter | 显示可用的代码修复/操作建议 |
| 触发参数提示 | F1 | |
| 转到定义 | F3 | 转到定义,默认快捷键:F12 |
| 切换行注释 | Ctrl + / | 双斜杠注释 |
| 切换块注释 | Ctrl + Shilft + / | 块注释 |
| 删除行 | Ctrl + D | 删除当前行 |
| 格式化文档 | Ctrl + I | 格式化代码 |
| 关闭编辑器 | Ctrl + W | 关闭正在编辑的活动窗口 |
| 查找(文本) | Ctrl + F | 在“当前文件”中搜索字符串 |
| 替换 | Ctrl + H | 在“当前文件”中替换字符串 |
| 在文件中查找 | Ctrl + Shift + F | 在“整个项目”中搜索字符串,,会打开左边的“搜索框” |
| 在文件中替换 | Ctrl + Shift + H | 在“整个项目”中替换字符串,,会打开左边的“替换框” |
| 按名称搜索文件 关键字:转到文件 |
Ctrl + E | 功能1:最近关闭的文件; 功能2:按名称搜索文件; 默认快捷键: Cmd + P |
| 打开最近的文件 | Ctrl + R | |
| 转到行/列 | Ctrl + L | |
| 查找所有引用 | Ctrl + G | 查找某个方法在项目中的使用统计 |
| 向下复制行 | Ctrl + Alt + ↓ | 复制当前行到下一行中。比Ctrl+C单纯的复制功能要方便好用(省掉了粘贴步骤),主要是用在编写代码时,需要移动代码的地方。 |
| 向上复制行 | Ctrl + Alt + ↑ | |
| 向下移动行 | Alt + ↓ | 移动单行(多行)代码。也是比Ctrl+C更好的快捷键。 |
| 向上移动行 | Alt + ↑ | |
| 重命名符号 关键字:重命名、rename |
F2 | 包括变量名、方法名、文件名 等标识符: (1) Java: 重命名 (2) acceptRenameInput (3) renameFile |
| 切换面板可见性 | Ctrl + J | 打开命令行终端 |
| 创建新的终端 | Ctrl + T | 新建命令行终端 |
| 查看:向右拆分编辑器 | Ctrl + P | 分成多列,方便对比查看 |
| 新建窗口 | Ctrl + N | |
| 文件:打开文件夹 | Ctrl + O | |
| 显示所有命令 | Ctrl + Shift + P | 打开命令面板 |
| 转换为大写 | Ctrl + Shift + U | |
| 转换为小写 | Ctrl + Shift + I | |
F2 重命名文件时,选择扩展名
在 VSCode 的资源管理器(左侧文件列表)中选中一个文件,然后连续按 F2 键,你会看到文件名的高亮选中状态在三种模式间循环切换:
| 按键次数 | 选中状态 | 说明 |
|---|---|---|
第一次按 F2 |
选中文件名全称(不含后缀) | 此时直接输入,只会修改文件的名字,保留原有的扩展名。这是最常用的模式。 |
第二次按 F2 |
选中文件全称(含扩展名) | 此时输入会替换掉整个文件名和扩展名。 |
第三次按 F2 |
选中文件扩展名 | 此时输入只会修改文件的后缀名,而主文件名保持不变。 |
三、常用插件
- 【Trae】如何导入VSCode插件?三种方法详解 —— 离线安装插件
<1>通用插件:
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| Local History | 是 VSCode 中一款非常实用的本地代码版本管理插件,它的核心价值是在本地自动、持续地保存文件的修改记录,弥补了 Git 等版本控制工具的局限性(比如忘记 commit、commit 前误删代码、本地未推送到远程的修改丢失等)。 | 查看 | 下载 |
| Speedy Git | 适用于VS Code内核的快速Git图形与历史界面 一款专为追求速度、清晰度和真正 Git 工作流强大功能的开发者打造的、以性能为先的 Git 图形化工具、Git 历史查看器及历史编辑工具——无多余功能,纯粹高效。 |
查看 | 下载 |
| File Git History | 在侧栏中查看文件历史。 | 查看 | 下载 |
| Git Buttons | 使用Git时,源代码管理视图中已添加了用于拉取和推送的图标 | 查看 | 下载 |
| Git Branch Manager | Git分支管理器 | 查看 | 下载 |
| JetBrains Idea Product Icon Theme | 左边导航栏Icon图标。 | 查看 | 下载 |
| XML Language Support by Red Hat | XML有关的智能提示、格式化等插件。 | 查看 | 下载 |
| Prettier - Code formatter | 最流行的代码格式化工具,一键美化代码(JS/TS, CSS, JSON, Markdown等),保持团队风格统一。 | 查看 | 下载 |
| Auto Close Tag | 当我们在结束标记中键入结束括号时,它将添加结束标记。它支持HTML,Handlebars,XML,PHP,Vue,JavaScript,Typescript,JSX等。 | 查看 | 下载 |
| Custom UI Style | 自定义VSCode/Trae界面样式,如修改字体大小 | 查看 | 下载 |
<2>办公插件:Markdown插件、PDF插件、Excel插件
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| Flux Flow Markdown Editor | 专为希望轻松处理 Markdown 文件、而非被 Markdown 烦恼困扰的用户打造的 VS Code 中功能最丰富的可视化 Markdown 体验——在 GitHub 中完美呈现格式。 | 查看 | 下载 |
| 一款由Tiptap驱动的精美所见即所得Markdown编辑器,以丰富的文本体验和主题选择编辑Markdown文件。 | 查看 | 下载 | |
| 使用所见即所得编辑器查看和编辑 Markdown。 | 查看 | 下载 | |
| 将Draw.io集成到VS Code中 | 查看 | 下载 | |
| PDF Viewer | 适用于 Visual Studio Code 的便携式文档格式 (PDF) 查看器。 | 查看 | 下载 |
| Markdown PDF and HTML | 将 Markdown 导出为 HTML 和 PDF,并支持 Mermaid。 | 查看 | 下载 |
| Markdown Preview Github Styling | 将 VS Code 的内置 Markdown 预览更改为与 GitHub 的样式一致。 | 查看 | 下载 |
| XLSX, CSV, TSV & Markdown Editor - VS Code Extension | 该插件能让VS Code变成一个实用的电子表格和Markdown编辑工具。你可以查看大量数据集、编辑表格文件、格式化表格内容,在CSV/TSV/XLSX格式之间进行转换。此外,还能在不出离编辑器的情况下编写Markdown代码,并实时查看预览效果。 | 查看 | |
<3>Vue3项目插件
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| Vue (Official) | 不仅支持 Vue3 语言高亮、语法检测,还支持 TypeScript 和基于 vue-tsc 的类型检查功能。 | 查看 | 下载 |
| Vue 3 Snippets | 插件旨在为开发者提供最简单快速的生成 Vue 代码片段的方法,通过各种快捷键就可以在 .vue文件中快速生成各种代码片段。 |
查看 | 下载 |
| Vue 2 Snippets | (同上) | 查看 | 下载 |
| Vite | Vite 插件可以让我们打开项目后,就能自动启动开发服务器,允许开发者无需离开编辑器即可预览和调试应用。支持一键启动、构建和重启项目。 | 查看 | 下载 |
| (最后卸载了,麻烦)一款语法检测工具。因为 JavaScript 本身是一门灵活的动态语言,一千个 JavaScriptor 就有一千种写法。为了方便人们的理解,快速上手别人的代码。 | 查看 | 下载 | |
| DotENV | 用环境变量来配置Node.js应用程序是很常见的。管理环境变量最流行的一个模块是dotenv。VS Code的DotENV扩展组件在编辑.env文件时添加了便捷的语法高亮显示功能。 | 查看 | 下载 |
| Error Lens | 改进错误、警告和其他语言诊断的高亮显示。 | 查看 | 下载 |
<4>SpringBoot项目插件
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| Extension Pack for Java |
|
查看 | 下载 |
| Java Launcher | 无需配置的Java启动器,具备快速搜索、聚合运行和Spring Profile管理功能。 | 查看 | 下载 |
| Spring Bean Navigator | |||
| Spring Boot Extension Pack | |||
| Spring Boot Tools | |||
| Spring Boot Dashboard | |||
| Spring Boot Extension Pack | |||
| Spring Initializr Java Support | |||
| Spring CLI | |||
| Lombok Annotations Support for VS Code | 支持Lombok注释处理的轻量级扩展。 | 查看 | 下载 |
| Java Interface Implementation Jumper | 轻松在Java接口及其实现之间跳转。 | 查看 | 下载 |
| Mybatis-Next | Java Mapper 接口和 XML Mapper 文件之间的双向跳转功能。 | 查看 | 下载 |
【VSCode/Trae】Spring Boot Java修改热更新
<5>Python插件
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| Python | 提供语言服务器支持、调试器集成和 IntelliSense。 | 查看 | 下载 |
| Python Development Extensions Pack | 此扩展包汇集了全栈Python开发或Web开发所需的一些最受欢迎以及我个人最喜爱的扩展。 | 查看 | 下载 |
| Black Formatter | 代码格式化。 | 查看 | 下载 |
| isort | 导入排序自动化。 | 查看 | 下载 |
| autoDocstring - Python Docstring Generator | 自动为 Python 函数、类、方法生成符合规范的文档字符串(Docstring)。 | 查看 | 下载 |
| Jupyter | 基于浏览器的笔记本(Notebook)环境,能在同一文档里混合编写代码、运行结果、富文本、公式与可视化,是数据科学、科研与教学的主流工具Jupyter。 | 查看 | 下载 |
| Pylance | 增强型语言支持,实现快速类型检查与符号跳转。 | 查看 | 下载 |
<6>Go插件
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| Go for Visual Studio Code | VS Code 开发 Go 的唯一核心插件,包含:代码提示、自动补全、跳转到定义、格式化、调试、运行测试、代码重构等所有基础功能。 | 查看 | 下载 |
| Go Mod Explorer | 可视化管理 Go 项目的模块依赖(go.mod)。 | 查看 | 下载 |
| Code Runner | VS Code 中一款非常受欢迎的代码快速运行插件,适合在开发过程中快速测试代码片段或整个文件,而不需要手动切换到终端输入命令。 | 查看 | 下载 |
<7>PHP插件
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| PHP | 一款专为PHP语言设计的开发工具。该工具的特点在于其符合行业规范、稳定性高、使用简单且性能优异。 该插件为VS Code增添了快速代码补全功能、先进的编辑器特性、代码修复工具、代码生成器、调试器、内置的开发用Web服务器、测试管理工具、测试调试器,以及能够对整个工作区中的代码进行分析的功能。 |
查看 | 下载 |
<8>AI 编程插件
| 插件名称 | 简介 | 官方地址 | 离线安装包 |
|---|---|---|---|
| Claude Code for VS Code | 在 VS Code 中直接释放 Claude 的原生能力。即刻搜索数百万行代码库,将耗时数小时的工作流浓缩为一条命令。你的工具,你的工作流,你的代码库,以思考的速度迭代进化。 | 查看 | 下载 |
| Codex – OpenAI’s coding agent | Codex 是一款能随时随地与你一起编程的编程助手——包含于 ChatGPT Plus、Pro、Business、Edu 和 Enterprise 套餐中。 | 查看 | 下载 |
参考文章: