Menu
I am making a simple "Hello World" program in React.js. I am expecting "Hello World" to be printed in the body of the html.
index.html
<html>
<head>
<script src="http://fb.me/react-0.12.2.min.js"></script>
<script>
var HelloWorld = React.createClass({
render: function() {
return <div>Hello, world!</div>;
}
});
React.render(new HelloWorld(), document.body);
</script>
</head>
<body>
</body>
</html>
Error:
Uncaught SyntaxError: Unexpected token <
Can someone tell me where am I making a mistake?
400
It executes React code and understands JSX and modern JavaScript features. It does that without using Babel.
Use Pug templates to write react components. babel-plugin-transform-react-pug is a plugin for babel which transpiles pug syntax within template literals to jsx.
Sol's answer covers why the simple hello app doesn't execute. The best practice on the latest React.js as of Jan 2017 is to import
<script src="https://unpkg.com/[email protected]/babel.min.js"></script>
and have the script type set to text/babel.
With this, you can execute JSX normally e.g.
class Greeting extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<p>Hello, Universe</p>
);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
