phantom phantom - 1 year ago 90
React JSX Question

React render method not working when referencing jsx file in html

I am trying to reference a jsx file from my html, but the render function is not showing anything, and there aren't any errors in the console.

*Note - I changed the fb CDN links below as SO wouldn't allow them. The CDN links are not the issue.

My code looks like this:


<script src="https://f*"></script>
<script src="https://f*"></script>
<script src="http://f*"></script>
<script src=""></script>

<div class="container">
<div id="loggedin"></div>
<script type="text/babel" src="js/script.jsx"></script>


var App = React.createClass({
render: function() {

ReactDOM.render(<App />, document.getElementById('loggedin'));

Answer Source

React uses babel to convert your jsx to js. So, add babel instead of JSXTransformer and save the file as .js not .jsx

Add this to your script

<script src=""></script>


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download