WebStorm中比较文件或文件夹需按场景选择操作：一、两已打开文件用Ctrl/⌘+D；二、一开一关用Project窗右键“与编辑器比较”；三、两文件夹在Project窗多选后右键“比较目录”；四、跨项目文件通过“与编辑器比较文件”手动选路径；五、大目录推荐配置meld等外部工具并设过滤规则。
如果您需要在WebStorm中识别两个文件或两个文件夹之间的内容差异，则需依据对象类型和路径关系选择对应的操作入口。以下是解决此问题的步骤：
一、比较两个已打开的文件
该方法适用于已在编辑器标签页中同时打开的两个文件，通过快捷键触发内置差异查看器，直接呈现逐行对比结果。
1、按住 Ctrl 键（Windows/Linux）或 ⌘ Command 键（macOS），在编辑器顶部标签栏中依次点击选中两个目标文件标签。
2、保持多选状态，按下 Ctrl+D（Windows/Linux）或 ⌘ Command+D（macOS）。
3、差异查看器将以并排模式打开，左侧为第一个选中文件，右侧为第二个选中文件；右侧窗格默认可编辑，左侧为只读参考。
二、比较项目内一个已打开文件与另一个项目文件
当仅有一个文件在编辑器中打开，而另一个待比对文件位于当前项目结构内时，可通过右键菜单快速建立关联对比。
1、确保目标文件已在编辑器中打开。
2、在 Project 工具窗口（Alt+1） 中定位到另一个待比对文件。
3、右键点击该文件，在上下文菜单中选择 “与编辑器比较文件”。
4、差异查看器将立即加载，左侧显示当前编辑器内容，右侧显示所选项目文件内容。
三、比较两个文件夹（同项目内）
WebStorm 支持对项目内两个文件夹进行结构与内容级对比，结果以树形列表+文件级差异双层视图展示，支持按存在性、大小、时间戳或内容筛选。
1、在 Project 工具窗口（Alt+1） 中按住 Ctrl 键（Windows/Linux）或 ⌘ Command 键（macOS），选中两个目标文件夹。
2、右键任一选中文件夹，在弹出菜单中选择 “比较目录”。
3、差异查看器 for Folders 将启动，上窗格列出所有文件路径比对状态，下窗格在双击具体文件后显示其内容差异。
4、使用工具栏按钮筛选：点击 “仅显示左侧有、右侧无” 或 “仅显示内容不同” 等图标快速聚焦关键差异。
四、比较任意路径下的两个文件（含项目外）
当待比对文件不在当前项目结构中（如 /tmp/config.json 与 /home/user/backup.json），需借助“与编辑器比较文件”操作手动指定外部路径。
1、先在编辑器中打开其中一个文件。
2、右键编辑器任意位置，选择 “与剪贴板比较” —— 若剪贴板为空，请先复制另一文件的全部文本内容。
3、或更推荐方式：右键编辑器标签页 → 选择已添加的 “与编辑器比较文件”（若未添加，需进入 Settings → Appearance & Behavior → Menus and Toolbars → 编辑器标签页弹出窗口菜单 → 添加该操作）。
4、在弹出的文件选择对话框中，**手动输入或浏览至项目外的第二个文件路径**，确认后加载对比。
五、使用外部图形化工具对比文件夹（推荐用于大目录或需过滤）
对于含 node_modules、dist 等大量干扰项的文件夹，或需忽略特定模式（如 .log、.tmp）的场景，内置对比易卡顿且不支持运行时过滤，此时应配置外部 diff 工具（如 meld、opendiff、xxdiff）实现高效可控对比。
1、进入 Settings → Tools → External Tools，点击加号新增工具。
2、填写参数：Program 填 meld（Linux/macOS）或 opendiff（macOS）；Arguments 填 $FilePath$ $Prompt$；Working directory 填 $ProjectFileDir$。
3、保存后，在 Project 工具窗口中右键任一文件夹，选择该外部工具名称。
4、在弹出的输入框中输入第二个文件夹的**绝对路径**，回车后自动调起外部工具完成对比，并支持在 Preferences → Filters 中预设 node_modules、*.log 等全局忽略规则。
