Atom无内置代码效果预览弹窗，需靠插件实现双栏对照：分屏布局+preview-plus等插件渲染，但不自动刷新，须手动触发；稳定方案是用live-server CLI配合浏览器独立预览。
Atom 本身没有“代码效果预览弹窗”这个功能，所谓“双栏对照查看”，实际就是分屏（Pane）+ 预览插件的组合用法，不是内置弹窗，也不能一键弹出。
Atom 分屏后怎么让 HTML/CSS 实时预览？
Atom 不像 VS Code 那样自带 Live Server 面板，必须靠插件实现预览。分屏只是提供布局，预览靠的是 atom-browser、open-in-browser 或 preview-plus 这类插件。
-
preview-plus是最接近“弹窗式预览”的选择：安装后，在 HTML 文件里按Ctrl-Shift-P输入preview-plus:toggle，它会在当前 Pane 下方新开一个 Pane 显示渲染结果——本质是上下分屏 + 内嵌 WebView - 如果想左右对照（比如左写 HTML，右看效果），先用
Ctrl+K → Right向右分屏，再在右侧 Pane 打开目标 HTML 文件，然后手动触发preview-plus:toggle；注意：它只作用于当前激活的 Pane，不会自动跨 Pane 渲染 -
open-in-browser更轻量，但不嵌入编辑器：右键文件 →Open in Browser，效果在系统默认浏览器打开，和 Atom 分屏无关——这时候“对照”靠的是你手动切窗口，不是 Atom 管理的布局
为什么 preview-plus 在分屏里不自动刷新？
常见现象：左边改了 HTML，右边预览 Pane 没变，要手动按 F5 或重开预览。这不是 bug，而是 preview-plus 的设计限制：它不监听文件保存事件，也不做热重载。
- 它只在首次执行
preview-plus:toggle时读取一次文件内容，后续修改需手动刷新（Ctrl-R）或重新 toggle - 如果你依赖实时反馈，
atom-browser插件支持更底层的 WebSocket 连接，但配置复杂，且对本地文件协议（file://）有跨域限制，容易报net::ERR_FILE_NOT_FOUND - 真正稳定的方案是弃用预览插件，改用
live-serverCLI：终端运行npx live-server，再用open-in-browser打开http://127.0.0.1:8080——这时 Atom 分屏只管代码，浏览器窗口独立负责刷新
左右分屏写 CSS + 预览 HTML 效果，怎么避免串行干扰？
典型场景：左 Pane 编辑 style.css，右 Pane 用 preview-plus 查看 index.html。问题在于，CSS 修改后，预览 Pane 不感知，且 preview-plus 不支持外部 CSS 文件热加载。
- 确保
index.html中的<link rel="stylesheet">路径是相对路径，且文件在 Atom 项目根目录下可被正确解析 - 不要把
preview-plus放在左 Pane（CSS 文件上）：它只渲染 HTML，对 CSS 文件无意义，强行触发会显示空白或报错Cannot preview this file type - 右键点击
index.html标签页 →Split Right，再在新 Pane 执行preview-plus:toggle；如果失败，检查该文件是否已保存（未保存的临时文件无法预览） - 更省事的做法：关闭
preview-plus，用Ctrl-Shift-P运行open-in-browser:open，然后把浏览器窗口拖到 Atom 右侧——视觉上仍是“左右对照”，但技术上解耦，稳定性更高
真正容易被忽略的一点：Atom 的分屏是「静态布局容器」，不是「智能联动视图」。所有“预览”效果都依赖插件能力，而主流预览插件都不支持双向绑定或文件变更监听。别指望它像 IDE 那样自动同步，手动刷新或外接服务才是常态。
