At Add React to a Website there's simple instructions to add a React component into a web page. This works fine run directly as a single page.
However, if the same page is "hosted" in a spring boot app, with a single route per this answer
@Controller
public class HomeController {
@GetMapping("/**")
public String react() {
return "index.html";
}
}
the text renders but not the react component.
The error in the console is Uncaught SyntaxError: Unexpected token '<'
If I try a direct route mapping
@GetMapping("/test")
public String react() {
return "index.html";
}
Again the react component doesn't display
It's a GET http://localhost:8082/like_button.js net::ERR_ABORTED 404 error
Is the problem that to run a react script in spring boot you have to install separate React app dependencies?
/* UPDATE */
It's something to do with the JSX and Babel per this answer. If I add to the index.html
<script src="https://unpkg.com/@babel/standalone/babel.min.js"> </script>
<!-- Load our React component. -->
<script type="text/babel" src="like_button.js"></script>
there's no longer an Uncaught SyntaxError: Unexpected token '<' error. The error is now:
Uncaught SyntaxError: /http:/localhost:8082/like_button.js: Unexpected token (11:5)
http://localhost:8082/like_button.jsis this js available from that URL? Put it in the public folder of spring boot app, first it should be available at that locationconst domContainer = document.querySelector('#like_button_container');ReactDOM.render(e(LikeButton), domContainer);