ReactJS.NET MVC tutorial doesn't work?
I figured it out - the tutorial is missing two things:
The script inclusion should be done thus, with a type declaration:
<script type="text/jsx" src="/Scripts/Tutorial.jsx"></script>The JSX transformer needs to be included:
<script src="http://fb.me/JSXTransformer-0.12.2.js"></script>
So the full HTML output by the Razor view should look like this:
<!DOCTYPE html>
<html>
<head>
<title>Hello React</title>
</head>
<body>
<div id="content"></div>
<script src="http://fb.me/react-0.12.2.js"></script>
<script src="http://fb.me/JSXTransformer-0.12.2.js"></script>
<script type="text/jsx" src="/Scripts/Tutorial.jsx"></script>
</body>
</html>
Looks like they need to update their tutorial.
Update:
Commenter @DanielLoNigro added this helpful tip:
Actually if you're using ReactJS.NET, you don't need to use the client-side JSXTransformer. Just ensure that the JSX handler is configured in your Web.config file (there should be a handler for .jsx).
This is how the .jsx handler can be registered in web.config:
<handlers>
<add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModule" resourceType="Unspecified"/>
<remove name="Babel" />
<add name="Babel" verb="GET" path="*.jsx" type="React.Web.BabelHandlerFactory, React.Web" preCondition="integratedMode" />
</handlers>
and in this case there is no need to have type="text/jsx" in script tag.
For me, even though my system was 64bit, I had to install JavaScriptEngineSwitcher.V8.Native.win-x86instead of JavaScriptEngineSwitcher.V8.Native.win-x64 and it solved the problem. It will interesting to hear why should I have to install x86 package.
PS: Mind you, that was for ASP.Net MVC though.