Minify error after vite build with react-dropzone-uploader

Viewed 280

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>
   );

}

1 Answers

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);
Related