侧边栏是项目管理中心,包含资源管理器、搜索、源代码管理、调试和扩展五大功能模块;2. 编辑区位于中间,是编写代码的主要区域。

刚打开 VS Code 时,密密麻麻的图标和区域可能会让人不知所措。其实只要搞清楚每个部分的作用,用起来就会顺手很多。下面带你一步步认识它的界面结构,快速从“小白”变“熟手”。
侧边栏:你的项目管理中心
左侧这竖条区域叫侧边栏,是日常操作最频繁的地方之一。
- 资源管理器:显示你打开的文件夹和所有文件,可以新建、重命名、删除文件,拖动调整顺序
- 搜索:全局查找关键词,支持正则和大小写匹配,适合在多个文件中找内容
- 源代码管理(Git):查看修改记录、提交代码、切换分支,集成基础 Git 功能
- 调试:设置断点、查看变量、逐步执行,适合排查程序问题
- 扩展:安装插件的一站式入口,搜“Python”“中文”就能加功能
点击顶部图标或按 Ctrl+Shift+E 可快速回到资源管理器。
编辑区:写代码的主战场
中间最大块区域就是编辑区,你写的每一行代码都显示在这里。
- 双击文件名或拖入文件,会自动打开并高亮当前行
- 语法高亮、自动缩进、括号匹配都是默认开启的,写 HTML、JS、Python 都很清晰
如果觉得字体太小,按住 Ctrl 滚动鼠标,或在设置里调整“editor.fontSize”数值。
状态栏:信息一目了然
窗口最底部是状态栏,别小看它,很多关键信息都集中在这儿。
- 左边显示当前文件类型(如 Python)、编码格式(UTF-8)、换行符(LF)
- 中间提示是否启用了 Git 分支,比如显示“main”
- 右边有缩放控件、语言模式切换、是否开启自动保存等按钮
点一下编码方式,还能切换成 GBK 或重新以其他编码打开文件,避免乱码。
面板区:输出与终端都在这儿
底部面板默认隐藏,按 Ctrl+`(反引号)调出终端,常用于运行脚本、启动服务。
- 可以切换到“输出”看插件日志,“调试控制台”查变量值,“问题”看语法错误列表
- 终端支持多标签,右键可新建、关闭、拆分,像命令行一样输入 node、python 命令
- 面板高度可拖动调整,也可以点右上角“^”收起,节省屏幕空间
基本上就这些。熟悉之后,你会发现 VS Code 的布局逻辑清晰,功能各归其位。不用一次性记住全部,常用几次自然就顺了。










