Learning ES6 and have run in to the following error straight off Super expression must either be null or a function, not undefined. Really unsure where my problem is, if anyone could help that would be great.

main.js

'use strict'

import Backbone from 'exoskeleton';
import App from './views/App';


var onDOMReady = () => {
    console.log('inside dom ready');
    window.app = new App();
}

if(document.readyState === 'complete' || document.readyState === 'interactive' || document.readyState === 'loaded' ) {
    onDOMReady();
} else {
    document.addEventListener('DOMContentLoaded', onDOMReady);
}

App.js

'use strict'

import Backbone from 'exoskeleton';

class App extends Backbone.View {

    initialize () {
        console.log('App: Init');
    }

    render () {
        console.log('App: Render');
    }

}

export default App;

Learning ES6 and have run in to the following error straight off Super expression must either be null or a function, not undefined. Really unsure where my problem is, if anyone could help that would be great.

main.js

'use strict'

import Backbone from 'exoskeleton';
import App from './views/App';


var onDOMReady = () => {
    console.log('inside dom ready');
    window.app = new App();
}

if(document.readyState === 'complete' || document.readyState === 'interactive' || document.readyState === 'loaded' ) {
    onDOMReady();
} else {
    document.addEventListener('DOMContentLoaded', onDOMReady);
}

App.js

'use strict'

import Backbone from 'exoskeleton';

class App extends Backbone.View {

    initialize () {
        console.log('App: Init');
    }

    render () {
        console.log('App: Render');
    }

}

export default App;

• javascript
• ecmascript-6

• 2 I think they don't mean literal super, but rather the extends clause. – Bergi Commented Sep 28, 2015 at 12:24
• @styler I am having the same issue. How did you fix it? – Mathew Kurian Commented Nov 3, 2015 at 1:29
• @Bergi if you don't create a constructor, it's automatically assumed to be constructor () {super()}. – Florian Wendelborn Commented Sep 7, 2016 at 19:20
• @Dodekeract: sure, but that's not where the error stems from. – Bergi Commented Sep 7, 2016 at 19:24
• 1 This happened to me because I tried to import and extend a class for which the base class from which I wanted to extend was missing an export in its own file. (answer converted to comment as per @stoebelj – FGM Commented Feb 28, 2017 at 14:20

3 Answers 3

I got this error because I had a circular import structure. One module importing another and the other way around.

Backbone.View may be undefined in your case. The snippet that produces this error is this,

if (typeof parent !== "function" && parent !== null) {
  throw new TypeError("Super expression must either be null or a function, not " + typeof parent);
}

The issue for me was because I had used

import { EditForm } from '../EditForm'

instead of

import EditForm from '../EditForm'

To make matters worse the error message was complaining about a completely unrelated component that hadn't been modified in weeks. Safe to say this one caused me some headaches. Just think back to what you recently modified and the error is likely there.