React sitemap.xml file in public directory is not showing after build

Question

I have a script that generates sitemap.xml file in the public directory. It is accessible in localhost:3000/sitemap.xml when it is in development. But when it goes for build, I cant access the file from the public folder. I made some research and I found out build doesnt have access of the public folder! Please help me with a way to access the public/sitemap.xml if there is any, if not is it possible to show .xml format as a page in reac-router-dom?

Answer 1

Reading through your question and comments there isn't a lot to work with, however I can inform you of a couple of things.

• The reason your sitemap might work locally and not on a build is because you're very likely using webpack-dev-server (if you're using CRA then you're using it), which in return uses express to locally serve your files. When you build it will no longer be using that server and you'll need your own custom server.

• When you build your files for production it will output all your files to static js/css files which then need to be served using some or other server (express/nginx/apache). In your question you've not specified what server you're using, beyond the development server, so I can only assume that you probably don't have any and/or are depending on some host that you're using without realizing that you're using one.

• When you want to serve something like .xml, you have to configure the server to actually serve .xml files. Also you should not be serving .xml as any form of react route, it's not a route and it has nothing to do with react. Your request should directly hit the server, i.e. nginx, and that server should be configured to serve the .xml file.

• In your comments you mentioned that it's "sitemap.exe", I'm not sure if that's a typo but you can't serve and run .exe files over web and no server will be configured to do so by default. The sitemap.xml or sitemap.txt should contain only the valid xml or text content and also make sure it's actually in the build directory once you've built it.

• If the .xml exists in your build and all of that's fine then the only thing left you need is to add a location block to your nginx server, or to add a get route to your express (or static resources) in order to actually serve that file. If your server is giving you a 404 at that point it likely means it isn't recognizing .xml files at all. That needs to be configured in your server.

In nginx it means you need something like location = /sitemap.xml.
In express it means you need something like app.get('/sitemap.xml').

A default nginx installation with try_files $uri $uri/ =404 should work for .xml as well.