关键词：Mirror / NAT / 回环 / VPN / Clash
WSL2 本质是 Windows 内运行的轻量 Linux 虚拟机。相比 Windows 原生开发，Node 环境更稳定、Docker 工具链兼容性更强。但实际开发中 WSL 2 可能有一些网络配置问题，导致 WSL 2启动的项目无法正常打开。
两种网络模式
NAT 模式（默认）
传统 WSL2 网络结构：
graph LR
W[Windows Host192.168.x.x] -->|Hyper-V NAT| H[Hyper-V Switch]
H --> L[WSL2 VM172.25.x.x]
特点：
- WSL2 是独立 VM，有独立 IP（
172.x.x.x段） - Windows 和 Linux 通过 NAT 通信
- WSL2 IP 经常变化，VPN / 代理容易出问题
但 localhost 通常仍能访问，因为微软做了
localhostForwarding：Windows 的 localhost 会自动代理到 WSL2 的 localhost。所以npm run dev后http://localhost:3000始终可用。
Mirror 模式（推荐）
在 .wslconfig 中配置：
[wsl2]
networkingMode=mirrored
hostAddressLoopback=true
graph LR
W[Windows Network Stack] --> L[WSL2 VM共享 Host 网络]
核心变化：
- WSL2 镜像 Host 网络栈
- VPN 网卡可直接被 WSL2 使用
[!tip] 前端开发强烈推荐 Mirror 模式 如果你在用 Clash + 公司 VPN + Docker，Mirror 模式会让体验好很多。
localhost 能访问，但 Network 不行？
这是最常见的坑。
$ npm run dev
VITE v6.0.0 ready in 320ms
➜ Local: http://localhost:9528/ # ✅ 可用
➜ Network: http://172.28.x.60:9528/ # ❌ 不可用
Vite 的 Network 地址怎么来的？
Vite 内部调用 os.networkInterfaces() 枚举本机所有网卡，选择第一个可用 IPv4 地址。你的环境（以 AX211 网卡 + Cisco VPN 为例）：
| 网卡 | IPv4 | 说明 |
|---|---|---|
| Intel Wi-Fi 6E AX211 | 10.162.x.x | 真实联网的物理网卡 |
| Cisco AnyConnect VPN | 172.28.x.60 | VPN 创建的虚拟网卡 |
| vEthernet (WSL) | 172.19.112.1 | Hyper-V 虚拟交换机 |
Vite 显示的是 172.28.x.60 — 那是 VPN 虚拟网卡的 IP。VPN 本质就是一张虚拟网卡，Cisco AnyConnect 创建的虚拟网卡拥有完整的 MAC 地址、IP、DNS、路由。Node / Vite 会把它当成真实网络接口，所以 Vite 的 Network 地址经常显示 VPN IP。
为什么 Network 地址默认打不开？
因为 Hyper-V 默认阻止 Host IP 回流。虽然 172.28.187.60 是本机 VPN IP，但 Windows 认为这是"网络访问"而非 localhost 回环，所以 Hyper-V 会拦截。可以使用 hostAddressLoopback 配置解决
[wsl2]
hostAddressLoopback=true
这个配置允许 Host 的所有 IP（WiFi IP、VPN IP、其他网卡 IP）进行回环访问 WSL2。开启后，172.28.x.x 就能访问 WSL2 服务了。
番外聊聊 Clash 的 UWP 回环
UWP（Universal Windows Platform）是 Windows 应用商店应用的运行框架。出于安全考虑，UWP 应用运行在沙箱中，默认无法访问 localhost（127.0.0.1）。
Clash 的代理服务默认跑在 127.0.0.1:7890，UWP 应用连不上这个端口，也就走不了代理。可使用 UWP Loopback 配置将特定程序配置走 UWP 回环。
