Rails and React: Fixing “Module not found” errors for JSX files
When compiling the assets through
bin/rails assets:precompile, we were getting the following error message:
However, it turns out the message is a little misleading. I discovered this by accident by changing the import line:
# hello-world-bundle.js - import HelloWorld from '../bundles/HelloWorld/components/HelloWorld' + import HelloWorld from '../bundles/HelloWorld/components/HelloWorld.jsx'
Trying to compile the assets again gave a different error:
HelloWorld.jsx: Support for the experimental syntax 'jsx' isn't currently enabled (8:5)
But JSX should come as part of the React installation, so I tried re-running the webpacker react generator:
$ bin/rails webpacker:install:react
From the logs, I could see this added
babel (amongst other things) to the
bin/rails s, the tutorial page worked as expected!