使用Vite+PostCSS时Chrome DevTools工作区无法持久化CSS修改

已正确配置Chrome DevTools的Workspaces功能，且CSS源映射已以数据URI形式嵌入CSS文件，但使用Vite作为开发服务器时，在DevTools的Styles面板修改CSS无法持久化到本地项目的原始PostCSS文件。

该问题仅与PostCSS相关：启用Vite的PostCSS配置时，Styles面板的修改无法回写到原始PostCSS文件；移除PostCSS配置后，修改可正常持久化。

复现步骤 #

• 搭建包含Vite和PostCSS的新项目
• 配置Vite在开发环境生成CSS源映射（设置devSourcemap: true）
• 配置Chrome DevTools的Workspaces功能，将其映射到项目目录
• 在浏览器和DevTools中打开项目
• 在DevTools的Styles面板修改某一CSS属性
• 观察到修改未持久化到原始PostCSS文件

预期结果 #

当源映射配置正确且DevTools的Workspaces功能设置妥当后，Styles面板的CSS修改应能持久化到原始PostCSS文件。

实际结果 #

Styles面板的CSS修改无法持久化到原始PostCSS文件，该问题仅在Vite配置中使用PostCSS时出现。

附加信息 #

• Vite版本：4.3.9
• PostCSS版本：8.4.24
• Chrome版本：114
• 操作系统：MacOS 13.4
• 已启用Chrome DevTools的Workspaces功能
• （仅注释PostCSS代码时配置生效）
• 
• （启用PostCSS后显示一致，仅样式编辑器修改无法持久化）

内容的提问来源于stack exchange，提问作者Michael Peters