<p dir="auto">This is weird, right?</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Module build failed: SyntaxError: /Users/quangbuule/Projects/React/mui-bug/src/index.js: 'super.*' is not allowed before super()
   8 |
   9 |   constructor() {
&gt; 10 |     super(...arguments);"><pre class="notranslate"><code class="notranslate">Module build failed: SyntaxError: /Users/quangbuule/Projects/React/mui-bug/src/index.js: 'super.*' is not allowed before super()
   8 |
   9 |   constructor() {
&gt; 10 |     super(...arguments);
</code></pre></div>
<p dir="auto">Babel6 produces an error when trying to compile class without a constructor.</p>
<div class="highlight highlight-source-shell notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="$ babel --version
6.0.15 (babel-core 6.0.20)
$ babel --presets react,es2015,stage-1 Hello.jsx
SyntaxError: Hello.jsx: 'super.*' is not allowed before super() (This is an error on an internal node. Probably an internal error)
undefined"><pre class="notranslate">$ babel --version
6.0.15 (babel-core 6.0.20)
$ babel --presets react,es2015,stage-1 Hello.jsx
SyntaxError: Hello.jsx: <span class="pl-s"><span class="pl-pds">'</span>super.*<span class="pl-pds">'</span></span> is not allowed before <span class="pl-en">super</span>() (This is an error on an internal node. Probably an internal error)
undefined</pre></div>
<p dir="auto"><strong>Hello.jsx</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var _ = require('underscore'),
    React = require('react');

class Hello extends React.Component
{
    state = {
        hello: 1
    };

/*
    constructor() {
        super();
    }
*/

    render() {
        var props = _.omit(this.props, 'children');
        return (
            &lt;p className=&quot;1&quot; {... props}&gt;Hello&lt;/p&gt;
        );
    }

    foo(param = 1) {
        this.param = param;
    }
}

module.exports = Hello;"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-s1">_</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'underscore'</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
    <span class="pl-v">React</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'react'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-k">class</span> <span class="pl-v">Hello</span> <span class="pl-k">extends</span> <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-c1">Component</span>
<span class="pl-kos">{</span>
    <span class="pl-c1">state</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span>
        <span class="pl-c1">hello</span>: <span class="pl-c1">1</span>
    <span class="pl-kos">}</span><span class="pl-kos">;</span>

<span class="pl-c">/*</span>
<span class="pl-c">    constructor() {</span>
<span class="pl-c">        super();</span>
<span class="pl-c">    }</span>
<span class="pl-c">*/</span>

    <span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
        <span class="pl-k">var</span> <span class="pl-s1">props</span> <span class="pl-c1">=</span> <span class="pl-s1">_</span><span class="pl-kos">.</span><span class="pl-en">omit</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">,</span> <span class="pl-s">'children'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
        <span class="pl-k">return</span> <span class="pl-kos">(</span>
            <span class="pl-c1">&lt;</span><span class="pl-ent">p</span> <span class="pl-c1">className</span><span class="pl-c1">=</span><span class="pl-s">"1"</span> <span class="pl-kos">{</span>... <span class="pl-s1">props</span><span class="pl-kos">}</span><span class="pl-c1">&gt;</span>Hello<span class="pl-c1">&lt;</span><span class="pl-c1">/</span><span class="pl-ent">p</span><span class="pl-c1">&gt;</span>
        <span class="pl-kos">)</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span>

    <span class="pl-en">foo</span><span class="pl-kos">(</span><span class="pl-s1">param</span> <span class="pl-c1">=</span> <span class="pl-c1">1</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
        <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">param</span> <span class="pl-c1">=</span> <span class="pl-s1">param</span><span class="pl-kos">;</span>
    <span class="pl-kos">}</span>
<span class="pl-kos">}</span>

<span class="pl-smi">module</span><span class="pl-kos">.</span><span class="pl-c1">exports</span> <span class="pl-c1">=</span> <span class="pl-v">Hello</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">After uncommenting the constructor it compiles:</p>
<div class="highlight highlight-source-shell notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="$ babel --presets react,es2015,stage-1 Hello.jsx
'use strict';

var _extends = Object.assign || function (target) { for (var i = 1; i &lt; arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i &lt; props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (&quot;value&quot; in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(&quot;Cannot call a class as a function&quot;); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(&quot;this hasn't been initialised - super() hasn't been called&quot;); } return call &amp;&amp; (typeof call === &quot;object&quot; || typeof call === &quot;function&quot;) ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== &quot;function&quot; &amp;&amp; superClass !== null) { throw new TypeError(&quot;Super expression must either be null or a function, not &quot; + typeof superClass); } subClass.prototype = Object.create(superClass &amp;&amp; superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var _ = require('underscore'),
    React = require('react');

var Hello = (function (_React$Component) {
    _inherits(Hello, _React$Component);

    function Hello() {
        _classCallCheck(this, Hello);

        var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Hello).call(this));

        _this.state = {
            hello: 1
        };
        return _this;
    }

    _createClass(Hello, [{
        key: 'render',
        value: function render() {
            var props = _.omit(this.props, 'children');
            return React.createElement(
                'p',
                _extends({ className: '1' }, props),
                'Hello'
            );
        }
    }, {
        key: 'foo',
        value: function foo() {
            var param = arguments.length &lt;= 0 || arguments[0] === undefined ? 1 : arguments[0];

            this.param = param;
        }
    }]);

    return Hello;
})(React.Component);

module.exports = Hello;"><pre class="notranslate">$ babel --presets react,es2015,stage-1 Hello.jsx
<span class="pl-s"><span class="pl-pds">'</span>use strict<span class="pl-pds">'</span></span><span class="pl-k">;</span>

var _extends = Object.assign <span class="pl-k">||</span> <span class="pl-k">function</span> <span class="pl-en">(target)</span> { <span class="pl-k">for</span> <span class="pl-smi">(var i = 1; i &lt; arguments.length; i++) { var source = arguments[i]; for (var key</span> <span class="pl-k">in</span> source) { <span class="pl-k">if</span> (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]<span class="pl-k">;</span> } } } <span class="pl-k">return</span> target<span class="pl-k">;</span> }<span class="pl-k">;</span>

var _createClass = (function () { <span class="pl-k">function</span> <span class="pl-en">defineProperties(target,</span> props) { <span class="pl-k">for</span> <span class="pl-smi">(var i = 0; i &lt; props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (<span class="pl-s"><span class="pl-pds">"</span>value<span class="pl-pds">"</span></span></span> <span class="pl-k">in</span> descriptor) descriptor.writable = <span class="pl-c1">true</span><span class="pl-k">;</span> Object.defineProperty(target, descriptor.key, descriptor)<span class="pl-k">;</span> } } <span class="pl-k">return</span> <span class="pl-k">function</span> <span class="pl-en">(Constructor,</span> protoProps, staticProps) { <span class="pl-k">if</span> (protoProps) defineProperties(Constructor.prototype, protoProps)<span class="pl-k">;</span> <span class="pl-k">if</span> (staticProps) defineProperties(Constructor, staticProps)<span class="pl-k">;</span> <span class="pl-k">return</span> Constructor<span class="pl-k">;</span> }<span class="pl-k">;</span> <span class="pl-en">})</span>();

<span class="pl-k">function</span> <span class="pl-en">_classCallCheck(instance,</span> Constructor) { <span class="pl-k">if</span> (<span class="pl-k">!</span>(instance instanceof Constructor)) { throw new TypeError(<span class="pl-s"><span class="pl-pds">"</span>Cannot call a class as a function<span class="pl-pds">"</span></span>)<span class="pl-k">;</span> } }

<span class="pl-k">function</span> <span class="pl-en">_possibleConstructorReturn(self,</span> call) { <span class="pl-k">if</span> (<span class="pl-k">!</span>self) { throw new ReferenceError(<span class="pl-s"><span class="pl-pds">"</span>this hasn't been initialised - super() hasn't been called<span class="pl-pds">"</span></span>)<span class="pl-k">;</span> } <span class="pl-k">return</span> call <span class="pl-k">&amp;&amp;</span> (typeof call === <span class="pl-s"><span class="pl-pds">"</span>object<span class="pl-pds">"</span></span> <span class="pl-k">||</span> typeof call === <span class="pl-s"><span class="pl-pds">"</span>function<span class="pl-pds">"</span></span>) <span class="pl-k">?</span> call <span class="pl-c1">:</span> self<span class="pl-k">;</span> }

<span class="pl-k">function</span> <span class="pl-en">_inherits(subClass,</span> superClass) { <span class="pl-k">if</span> (typeof superClass <span class="pl-k">!</span>== <span class="pl-s"><span class="pl-pds">"</span>function<span class="pl-pds">"</span></span> <span class="pl-k">&amp;&amp;</span> superClass <span class="pl-k">!</span>== null) { throw new TypeError(<span class="pl-s"><span class="pl-pds">"</span>Super expression must either be null or a function, not <span class="pl-pds">"</span></span> + typeof superClass)<span class="pl-k">;</span> } subClass.prototype = Object.create(superClass <span class="pl-k">&amp;&amp;</span> superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: <span class="pl-c1">true</span> } })<span class="pl-k">;</span> <span class="pl-k">if</span> (superClass) Object.setPrototypeOf <span class="pl-k">?</span> Object.setPrototypeOf(subClass, superClass) <span class="pl-c1">:</span> subClass.__proto__ = superClass<span class="pl-k">;</span> }

var _ = require(<span class="pl-s"><span class="pl-pds">'</span>underscore<span class="pl-pds">'</span></span>),
    React = require(<span class="pl-s"><span class="pl-pds">'</span>react<span class="pl-pds">'</span></span>)<span class="pl-k">;</span>

var Hello = (function (_React<span class="pl-smi">$Component</span>) {
    _inherits(Hello, _React<span class="pl-smi">$Component</span>)<span class="pl-k">;</span>

    <span class="pl-k">function</span> <span class="pl-en">Hello()</span> {
        _classCallCheck(this, Hello)<span class="pl-k">;</span>

        var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Hello).call(this))<span class="pl-k">;</span>

        _this.state = {
            hello: 1
        }<span class="pl-k">;</span>
        <span class="pl-k">return</span> _this<span class="pl-k">;</span>
    }

    _createClass(Hello, [{
        key: <span class="pl-s"><span class="pl-pds">'</span>render<span class="pl-pds">'</span></span>,
        value: <span class="pl-k">function</span> <span class="pl-en">render()</span> {
            var props = _.omit(this.props, <span class="pl-s"><span class="pl-pds">'</span>children<span class="pl-pds">'</span></span>)<span class="pl-k">;</span>
            <span class="pl-k">return</span> React.createElement(
                <span class="pl-s"><span class="pl-pds">'</span>p<span class="pl-pds">'</span></span>,
                _extends({ className: <span class="pl-s"><span class="pl-pds">'</span>1<span class="pl-pds">'</span></span> }, props),
                <span class="pl-s"><span class="pl-pds">'</span>Hello<span class="pl-pds">'</span></span>
            )<span class="pl-k">;</span>
        }
    }, {
        key: <span class="pl-s"><span class="pl-pds">'</span>foo<span class="pl-pds">'</span></span>,
        value: <span class="pl-k">function</span> <span class="pl-en">foo()</span> {
            var param = arguments.length <span class="pl-k">&lt;</span>= 0 <span class="pl-k">||</span> arguments[0] === undefined <span class="pl-k">?</span> 1 <span class="pl-c1">:</span> arguments[0]<span class="pl-k">;</span>

            this.param = param<span class="pl-k">;</span>
        }
    }])<span class="pl-k">;</span>

    <span class="pl-k">return</span> Hello<span class="pl-k">;</span>
})(React.Component)<span class="pl-k">;</span>

module.exports = Hello<span class="pl-k">;</span></pre></div>