栅格包裹 SVG：把「合并可见」像素封进 `<image>`，用 XML 声明画幅，别把它当成路径导出器
`psd-svg-raster-wrap` 适合设计系统文档、评审页或 Storybook 里需要「一个文件拖进去就能看」的场景：外层 SVG 提供视口与尺寸语义，内层仍是 PNG。混合模式、调整图层与智能对象在合并时已被烘焙，浏览器里不可能再逐层对齐 Photoshop。若有人坚持要在 DevTools 里改 `path`，应明确告知此文件不包含那条路径数据。
如何使用
- 在 Photoshop 用合并可见到新图层对照整稿，确认长边与 sRGB 工作流一致，再上传；需要透明底时在合并前处理好 alpha，避免在 SVG 里靠 CSS 硬抠。
- 下载后用文本编辑器快速确认仅有 `<image>` 引用而无意外 `<foreignObject>`，再在 Chrome 与 Safari 各打开一次排除 WebKit 与 Blink 缩放差异。
- 把 `viewBox` 与内嵌图实际像素写入 README，供前端计算 `sizes`；变更时递增包版本并更新指纹 URL。
PSD 转 SVG（raster）问答
PSD 里明明有大量形状与路径，为什么生成的 SVG 里几乎看不到 `<path>`，只有一张内嵌图，这是否说明转换失败？
这是本工具链的设计目标：先合并可见得到像素，再把像素封进 SVG 容器，便于统一 MIME 与嵌入；它不会把每个形状反向导出为可编辑 SVG 路径。若业务需要矢量，应在 Illustrator/Figma 维护矢量源或走桌面导出；把「有形状图层」当成「应出路径」是预期错位而非 bug。
复杂混合模式与渐变映射在浏览器里看与 Photoshop 逐层预览不一致，应以哪一帧像素为准验收？
应以 Photoshop 合并可见后的单帧像素为准，因为在线链路等价于该合成再编码；不要在浏览器里打开旧的分层幻想去对比。若争议，保存 PSD 内「合并可见」新图层与 SVG 内嵌图做像素 diff，比口头争论混合数学更快。
智能对象缩放后边缘发糊，怀疑 PNG 被过度压缩，应优先查源稿还是查 SVG 包装？
优先在 Photoshop 用最终展示尺寸做一次高质量栅格化并检查插值算法；包装层不会恢复已被缩小采样掉的细节。若需 Retina，应直接提高合并长边，而不是在 CSS 里把 800px 图拉到 1600px 显示。
前端希望用 `<img src="*.svg">` 直接引用，这类栅格包装在 CSP、缓存与尺寸属性上容易踩哪些坑？
需确认 `img-src` 允许该域、是否禁止内联 `data:`、以及是否要求 `width`/`height` 防止 CLS；应用指纹文件名与 `Cache-Control`。设计预览往往未做体积优化，不要把它当 LCP 主图不经评估就塞进首屏。
批量把 PSD 变成目录缩略 SVG 时，怎样避免不同纵横比被同一裁切策略切掉标题或关键信息？
应按横版、竖版、方图分桶设定不同的长边适配与留白策略，批处理前用每类三张金样验收；异常稿件单独隔离调参，禁止为救一张图全局改裁切导致整批 SKU 封面被切头。