文件资源管理器位于VSCode左侧,用于高效管理项目结构。默认显示在边栏,可通过Ctrl+Shift+E(Windows/Linux)或Cmd+Shift+E(Mac)打开。点击文件在编辑器中打开,双击文件夹展开内容。右键可新建、重命名(F2)、删除文件或文件夹。支持拖拽调整结构,但需手动更新代码内导入路径。通过“files.exclude”设置可隐藏node_modules、.git、*.log等文件,仅视觉隐藏不影响实际存在。熟练使用可提升开发效率。

在VSCode中,文件资源管理器是管理项目结构的核心工具。它位于界面左侧,能直观展示项目中的文件和文件夹,帮助你高效组织代码。
打开和导航文件资源管理器
默认情况下,文件资源管理器显示在编辑器的左侧边栏。如果未显示,可以按下 Ctrl+Shift+E(Windows/Linux)或 Cmd+Shift+E(Mac)快速打开。点击任意文件即可在编辑器中打开它,双击文件夹可展开查看内容。
创建、重命名和删除文件与文件夹
右键点击资源管理器中的空白区域或某个文件夹,会弹出操作菜单:
- 新建文件:输入文件名(如 index.js)并回车
- 新建文件夹:创建目录用于分类管理文件
- 重命名:选中文件或文件夹后按 F2,修改名称
- 删除:右键选择“删除”将文件移至系统回收站
拖拽调整项目结构
你可以直接用鼠标拖动文件或文件夹到目标位置来移动或重组项目结构。VSCode会自动更新路径引用提示,但注意:这不会自动修改代码内的导入路径,需手动检查相关引用是否需要调整。
隐藏特定文件或文件夹
通过修改设置可以隐藏不想看到的文件,比如 node_modules 或编译生成的 dist 目录。打开设置(Ctrl+,),搜索 “files.exclude”,添加要隐藏的模式:
例如:- node_modules/** — 隐藏所有 node_modules 文件夹内容
- .git — 隐藏 Git 元数据目录
- *.log — 隐藏日志文件
这些只是视觉隐藏,不影响实际文件存在。
基本上就这些。熟练使用文件资源管理器,能让你的项目结构清晰有序,提升开发效率。










