TypeError: Super expression must either be null or a function, not undefined

[eltoro]

I get this error:
TypeError: Super expression must either be null or a function, not undefined
_inherits
node_modules/@uppy/dashboard/lib/ActionBrowseTagline.js:5

I had Uppy working fine and then it broke when some package upgraded (not sure what changed). I was using 0.25.6 when it happened. I tried upgrading to 0.26.0 and it didn't help. Here is what I'm currently using:

"@uppy/core": "0.26.0",
"@uppy/react": "0.26.0",
"@uppy/xhr-upload": "0.26.0",
"react": "16.4.2",

import Uppy from '@uppy/core';
import { Dashboard } from '@uppy/react/lib/Dashboard';
import XHRUpload from '@uppy/xhr-upload';

export class NoteUploader extends Component {
  constructor(props) {
    super(props);

    const idToken = localStorage.getItem('id_token');

    this.uppy = new Uppy({
      autoProceed: false
    }).use(XHRUpload, {
        endpoint: `${process.env.REACT_APP_API_URL}/upload`,
        fieldName: 'files[]',
        headers: {
          accept: 'application/json'
        }
    });
  }

Any ideas what is wrong?

[arturi]

Hi! Hm, where are you actually using the Dashboard component? Can’t see in the example 🤔

[eltoro]

Sorry, I left that out. Here is a brief version of my render:

render() {
    return (
      <div className={this.state.minimize ? 'new-note-file minimize' : 'new-note-file'} >
        <div className="mainContainer">
          <Form id="NoteUploader" onSubmit={this.props.handleSubmit(this.submitNote)} noValidate>
            <div className="content">
              <Dashboard
                uppy={this.uppy}
                maxHeight={350}
                showProgressDetails
              />
            </div>
          </Form>
        </div>
      </div>
    );
  }
}

[eltoro]

To be clear, Uppy was working with 0.25.6 and then suddenly broke on a new build. I then upgraded to 0.26.0 and the problem still exists.

[eltoro]

Found my mistake:
import { Dashboard } from '@uppy/react/lib/Dashboard';
Should be this:
import Dashboard from '@uppy/react/lib/Dashboard';

For some reason this didn't work for me:
import { Dashboard } from '@uppy/react'

[eltoro]

After doing an npm install the problem is back. But I found a fix. I reverted Preact from 8.3.0 to 8.2.9 in package-lock.json and did an npm ci to install from the package-lock.

Wondering if anybody else has had this problem and how they fixed 'npm install'.

[arturi]

Did a clean install — works for me. But I can also spot the upgraded Preact in package-lock.json, I wonder how when we "preact": "^8.2.9" dependency everywhere.

Also using:

import { Dashboard, DashboardModal, DragDrop, ProgressBar } from '@uppy/react', works for me as well.

What error are you getting when trying to use the above? And what bundler are you using?

Found this: https://stackoverflow.com/questions/35777991/typeerror-super-expression-must-be-null-or-a-function-not-undefined-with-babel/35778089.

[goto-bus-stop]

preact 9.3.0 changed the path to the ES modules file inside the package (preactjs/preact#1166). Are you using webpack with a caching plugin maybe? That could explain the intermittent errors.

[Sebs030]

Hi everyone, I just upgraded to create-react-app 2.0.3 and now I suddenly get this error:

Before i used "react-scripts": "1.1.4" and everything was working fine. The error is actually popping up in a view where don´t even call or mount an uppy component. Has anyone experienced the same using create-react-app V2 - and maybe even a solution to this problem? I am using:
"@uppy/core": "^0.27.3", "@uppy/react": "^0.27.5", "@uppy/webcam": "^0.27.4",

[arturi]

Seems related: preactjs/preact#686 (comment)

[andrew-oko-odion]

Any progress on this issue?

It is still not working on React

[goto-bus-stop]

I haven't been able to reproduce it :/ does it also happen for you in a new create-react-app or only upgrading an existing one?

[Sebs030]

No i just checked, creating a fresh create-react-app with "react-scripts": "2.0.5" works just fine. However in my original post, when I again downgraded to "react-scripts": "1.1.5" my app just worked again as expected. So it seems to be something in the upgrade process coming form a version 1.1.4 which could be leading to this behavior

[iki]

@eltoro FYI, I had the same issue on ejected create-react-app with @uppy/react 2.9.0. Tried also 2.6.0, 2.7.3, 2.8.0 without success. Experiments with uppy modules did narrow the issue down to .mjs import.

The solution was to edit webpack config and apply CRA fix facebook/create-react-app#5258 to re-enable .mjs support.

Kudos to @arqex for for pointing me in the right direction in his post on .mjs:
https://medium.com/passpill-project/files-with-mjs-extension-for-javascript-modules-ced195d7c84a

[arturi]

@iki I wonder if there’s anything we can do, besides mentioning this in docs somewhere?

[iki]

@arturi thanks for caring, imo there's nothing needed. This was just a temporary create-react-app issue and will fade out. Also this fix can be googled quickly now.

[GoudekettingRM]

I'm getting this one as well, but now in react-on-rails ("react": "^17.0.2", "@uppy/react": "^2.1.0")

Here is where it first throws a type error, where it claims that new Uppy does not return void.

Hacking my way out of that error by using new (Uppy as any)(options), the error is thrown as follows:

Also using the file input baked into @uppy/react I get that error..

[Murderlon]

@GoudekettingRM you are not initializing Uppy correctly and I also can not reproduce this error. Here is a codesandbox with correct initialization and no errors: https://codesandbox.io/s/kind-kare-vjzsd?file=/src/App.js

[GoudekettingRM]

@Murderlon I copied your codepen, same result. Same TS error, same console error.

[Murderlon]

@GoudekettingRM you are running an outdated version of Uppy. Your options:

• Upgrade. 2.0 post / migration guides (recommended)
• Don't use the new keyword. Default export is a function on 1.0
• import { Uppy } from '@uppy/core', which is the Uppy class.