Vue 2集成Filepond与Pintura后上传SVG自动转PNG，如何保留原SVG格式？

这个问题的核心原因是Pintura图像编辑器默认仅允许导出位图格式，未将SVG加入导出白名单，且默认导出优先级高于原文件格式，按以下步骤配置即可保留原SVG格式：

• 第一步：在Pintura编辑器配置中新增SVG导出许可，指定导出格式优先匹配原文件类型
  对应Vue组件配置示例如下：

  <template>
    <file-pond
      ref="pond"
      name="files"
      :server="yourUploadServerConfig"
      :accepted-file-types="['image/*']"
      :allow-image-edit="true"
      :image-editor="imageEditorConfig"
    />
  </template>
  
  <script>
  export default {
    data() {
      return {
        imageEditorConfig: {
          editor: pintura,
          editorConfig: {
            export: {
              // 导出格式优先对齐原文件的MIME类型，不强制转码
              target: (originFile) => originFile.type,
              // 新增SVG到允许导出的格式列表
              allowedFormats: ['image/jpeg', 'image/png', 'image/webp', 'image/svg+xml']
            }
          }
        }
      }
    }
  }
  </script>
  

• 第二步：移除可能存在的强制转码配置
  检查你的FilePond全局配置，删除imageTransformOutputMimeType、imageEditorOutputMimeType这类强制指定输出格式为PNG的参数，如果需要保留对其他格式的转码规则，可以单独对SVG类型做例外处理。
• 可选优化：如果不需要对SVG做编辑操作，可以直接配置跳过SVG的编辑器加载，彻底避免转码风险：

  // 将allow-image-edit属性替换为动态判断
  :allow-image-edit="(file) => file.type !== 'image/svg+xml'"
  

内容的提问来源于stack exchange，提问作者Felix Berlin