WebStorm 用 Quick File Preview 实现单击文件预览

Quick File Preview 快速预览插件

作用

安装此插件后，单击文件夹会自动展开目录，单击文件文件会进入预览状态，单击其他文件时会在 tab 标签选项中消失

如果想单击文件不是预览状态可以想下图所示操作

• 右键点击左上角的 Project
• 勾选 open files with single click

这个需求是怎么来的

WebStorm 默认的 Project 面板行为是：单击文件只选中、双击才真正打开。这套交互在读代码的时候特别别扭——想快速扫一遍某个目录下十几个文件的内容，得双击十几次，而且每次双击都会开一个常驻的 tab，扫完之后一排 tab 挤成一团，得再一个个关掉。

VS Code 的默认行为正好相反：单击就在编辑区显示内容，tab 标题是斜体（表示预览态），点下一个文件时直接替换掉它，不累积 tab。只有双击或者在预览态里输入内容，才会把它「钉」成正式的 tab。这个模式对浏览代码友好得多，Quick File Preview 就是把这套行为搬到了 WebStorm 里。

装插件的步骤

插件在 JetBrains 官方仓库里，直接在 IDE 内装：

• macOS：WebStorm → Settings（快捷键 Cmd + ,）→ Plugins
• Windows / Linux：File → Settings（Ctrl + Alt + S）→ Plugins

切到 Marketplace 标签，搜 Quick File Preview，点 Install，装完提示重启 IDE。这个插件对 IntelliJ 平台的所有 IDE 都有效（IDEA、PyCharm、GoLand 都能用），不是 WebStorm 专属。

如果 Marketplace 搜不到（公司网络限制、或者插件不兼容当前 IDE 版本），可以去 plugins.jetbrains.com 下载对应版本的 zip，然后在 Plugins 页面点右上角的齿轮 → Install Plugin from Disk 手动装。注意选版本时要看插件页面标注的兼容版本范围，装了不兼容的版本 IDE 启动时会自动禁用它。

预览态和正式打开的区别

装完之后有三种状态需要分清，不然会觉得行为很随机：

• 预览态 — 单击文件进入。tab 存在，但下次单击其它文件时它会被替换掉。适合快速浏览。
• 正式打开 — 双击文件，或者在预览态下开始编辑内容。tab 被固定下来，不会被替换。
• 未打开 — 只是在树里选中，编辑区没变化（关掉插件后单击的默认行为）。

这里有个实用细节：在预览态的文件里改一个字符，它就自动转正。所以你不用担心「预览着改了代码结果被替换掉丢了」——只要动了内容，tab 就固定住了。这和 VS Code 的行为一致。

不装插件的原生做法

正文里提到的右键 Project 面板勾选 Open Files with Single Click，其实是 IDE 自带的选项，不需要插件。但要说清楚它和插件的区别，两者解决的不是同一个问题：

• 原生的 Open Files with Single Click — 让单击就打开文件，但打开的是正式 tab，不是预览态。tab 照样会累积。
• Quick File Preview 插件 — 提供的是「单击进预览态、不累积 tab」这个 VS Code 式的行为。

所以如果你的痛点只是「不想双击」，勾原生选项就够了，不用装插件。如果痛点是「tab 太多」，才需要插件。

顺带说，Open Files with Single Click 这个选项在不同 WebStorm 版本的位置有变化：新版本在 Project 面板右上角的三个点（⋮）菜单里，老版本是右键面板空白处或者标题栏。找不到就在 Settings 里搜关键词 single click。

更根本的解法：限制 tab 数量

tab 爆炸这个问题，除了预览态，还有另一条思路是让 IDE 自动关掉旧 tab。在 Settings → Editor → General → Editor Tabs 里：

• Tab limit — 默认 10。超过这个数量时最早打开的 tab 会被自动关闭。我一般设成 8，配合下面的固定功能够用了。
• When the current tab is closed — 选 Activate most recently opened tab，关掉当前 tab 后跳到上一个用过的，比跳到相邻 tab 符合直觉。
• Show tabs in one row — 取消勾选后 tab 会换行显示，能同时看到更多。但会占掉编辑区高度，看个人偏好。

想让某个文件不被自动关掉，右键 tab 选 Pin Tab（快捷键可以在 Keymap 里搜 Pin Active Tab 自己绑）。被 pin 的 tab 会挪到左侧，不参与 Tab limit 的淘汰。

相关的几个导航技巧

说实话，用熟了下面这几个快捷键之后，我点 Project 面板的频率大幅下降，「单击还是双击」这个问题也就没那么重要了：

• Shift + Shift（Search Everywhere）— 输入文件名/类名/符号名直接跳，模糊匹配，支持驼峰缩写（输 uds 能匹配 UserDetailService）。
• Cmd + E / Ctrl + E（Recent Files）— 弹出最近打开的文件列表，上下键选。这是我用得最多的一个。
• Cmd + Shift + E / Ctrl + Shift + E（Recent Locations）— 比上一个更强，列出的是最近编辑过的代码位置并带上下文预览，跨文件回溯改动特别好用。
• Cmd + [ / Cmd + ]（macOS）或 Ctrl + Alt + ←/→（Windows）— 后退/前进，行为和浏览器的前进后退一样。
• Cmd + Shift + Backspace（Last Edit Location）— 跳回上一次编辑的地方。看了一圈代码想回到刚才改的位置时用它。

Project 面板真正不可替代的场景是「我不知道文件叫什么，只知道大概在哪个目录」，或者需要做文件的重命名、移动这类操作。纯粹为了打开一个已知名字的文件，键盘永远比鼠标快。