user1050619
user1050619

Reputation: 20856

Reactjs -- Unreachable code after return statement

I get the following error while executing this piece of code -

Unreachable code after return statement.

<!DOCTYPE html>
<html>
<head>
    <title>React Components</title>
</head>

<body>
    <div id="react-container"></div>
    <script type="text/babel">

        var MyComponent = React.createClass({ 
        render: function(){ return
                <div>MyComponent</div>; } 
                }); 

        React.render(<MyComponent/> ,document.getElementById('react-container'));

    </script>
</body>

</html>

Upvotes: 2

Views: 4563

Answers (2)

AVI
AVI

Reputation: 5703

The problem was probably you are using newer version of babel(versions which comes after 6). Because i faced the same problem like you.Try using a version which is older like as follows,

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.js"></script>

Upvotes: 1

djskinner
djskinner

Reputation: 8125

JSX cannot be interpreted by browsers so you cannot do things like return <div>MyComponent</div> directly in an HTML page that you intend to render on a browser like this. You will need to transpile the JSX into ES5 using Babel before gicing it to the browser to interpret.

Upvotes: 0

Related Questions