'Minify error after vite build with react-dropzone-uploader

I have migrate my app from cra to vite but now my dropzone uploader is not working and return me this error only in production

Its look like the error come from the Dropzone component but I can't explain why it work fine in development and was working with CRA

error: Uncaught Error: Minified React error #130; visit https://reactjs.org/docs/error-decoder.html?invariant=130&args[]=object&args[]= for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

component:

import Dropzone from "react-dropzone-uploader";
import api from "../../../Service/API/API";

import {lang} from "../../../Service/Translator";
import "../../../App.css"

export function UploadBox({update, closeAfterUpload, onClose, body, url, disabled}) {

   const getUploadParams = ({file, meta}) => {
      const body = new FormData()
      for (let k of Object.keys(body)) {
         body.append(k, body[k])
      }

      body.append('title', file.name.split(".")[0])
      body.append('file', file)

      return {
         url: `${api.getURL()}${url ? url : 'user/files'}`,
         body: body,
         field: {},
         headers: {Authorization: `Bearer ${api.Auth.getAccessToken()}`},
         meta: meta
      }
   }

   // called every time a file's `status` changes
   const handleChangeStatus = ({meta, file, xhr}, status) => {
      if (status === 'done') {
         let response = JSON.parse(xhr.response)
         meta.id = response.id

         api.snackAction(lang.UploadSucceed.replace('{0}', meta.name), "success")

         update ? update() : null

         if (closeAfterUpload) {
            onClose()
         }
      } else if (status === 'aborted') {
         api.snackAction(lang.UploadAborted.replace('{0}', meta.name), "warning")

      } else if (status === 'error_upload') {
         api.snackAction(lang.UploadError.replace('{0}', meta.name), "error")

      } else if (status === 'rejected_file_type') {
         api.snackAction(lang.UploadRejectedFileType, "Warning")

      } else if (status === 'removed') {
         api.Enterprise
            .Files
            .delete(meta.id)
            .then(() => {
               update ? update() : null
            })

      }

   }

   return (
      <div>
         <Dropzone
            disabled={disabled}
            body={body}
            getUploadParams={getUploadParams}
            onChangeStatus={handleChangeStatus}
            classNames={"preview_darkmode"}
            maxSizeBytes={Math.pow(2, 30)}
            // onSubmit={this.handleSubmit}
            accept="image/*,.pdf"
         />

      </div>
   );

}



Solution 1:[1]

by me i create following file and use DropzoneFix component, and works:

// DropzoneFix.tsx
import Dropzone from 'react-dropzone-uploader';
function fixComponent<T>(component: T): T {
    return (component as any).default ?? component;
}
export const DropzoneFix = fixComponent(Dropzone);

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Chen