create-react-app shows an error of "You need to enable JavaScript to run this app."

Question

I use express for my API. I have a folder named app and another folder named server. app is the client app, using create-react-app as boilerplate, while server is express.js app for the API.

in the app.js file of the server, I wrote

app.get("*", function (req, res) {
    res.sendFile(path.resolve(__dirname, '../app/build/index.html'));
})

But then when I call any API endpoint, I get

You need to enable JavaScript to run this app.

in the response. I'm confused; what's wrong?

Answer 1

In the build directory you have more files that just index.html. You also have build/js/main.buildNumber.js and build/css/main.buildNumber.css. So when your frontend makes a request to https://yourdomain.com/css/main.buildNumber.js, it incorrectly returns index.html not main.js.

Instead, you should serve the contents of the build folder statically with express.static

    app.use('/', express.static(__dirname + '/'));

Or you can look into the "serve" node module to host your app. This will work nicely with react-router. npm i -g serve then cd build then serve . --single -p 5000. This will serve your app on port 5000 (http://localhost:5000).

Answer 2

For me, the issue was that I was mixing styles for functional and class based components. Double check that you don't have any dangling this keywords, or perhaps some missing of the same.