How to create a production build of a create react app?

Question

I am trying to create a production build for online deployment of create-react-app with an express js backend using docker.

This is my docker file:

FROM node:12.18.3
WORKDIR /app
COPY ["package.json", "package-lock.json", "./"]
RUN npm install --production
COPY . .

RUN npm run build

EXPOSE 80
CMD ["npm", "start"]

I am using npm run build but still the react developer tools tells that it is a development build and not a production build.

Also in the sources all the project files are visible which should not be visible:

I have tried adding the below statement in the .env file in the root directory of the create-react-app but the project files are still visible:

GENERATE_SOURCEMAP=false

It will be helpful if anyone can guide me how do I fix this and create a production build.

Thank you

Answer 1

For those looking for a solution, the issue can be fixed by creating a server.js file in the project directory with the following content:

const express = require('express');
const serveStatic = require('serve-static');
const path = require('path');
const app = express();

// create middleware to handle the serving the app
app.use("/", serveStatic ( path.join (__dirname, '/build') ) );
// Catch all routes and redirect to the index file
app.get('*', function (req, res) {
res.sendFile(__dirname + '/build/index.html')
});

// Create default port to serve the app on
const port = process.env.PORT || 3000
app.listen(port);

also in the docker file add:

CMD ["node", "server.js"]

instead of

CMD ["npm", "start"]