React Build page

I wanted to deploy a react app to nginx, with the following commands

# [...] repo is fetched and env vars are set
cd $REPO_PATH/Frontend
npm install
npm run build

if [ $? -eq 0 ]; 
then
    echo "Build Frontend, Deploying"
    sudo rm -rf /var/www/html/*
    sudo cp -r $REPO_PATH/Frontend/build/* /var/www/html/
else
    echo "Failed to Build frontend, Kept the old one alive" 
fi

# [...] repo is fetched and env vars are set
cd $REPO_PATH/Frontend
npm install
npm run build

if [ $? -eq 0 ]; 
then
    echo "Build Frontend, Deploying"
    sudo rm -rf /var/www/html/*
    sudo cp -r $REPO_PATH/Frontend/build/* /var/www/html/
else
    echo "Failed to Build frontend, Kept the old one alive" 
fi

But i found out that npm run build only produces an index.html and i get error 404 if I navigate on the deployed page. Is there a way to fix this without changing the code, it's not mine.

1 Reply

Bored StudentOP•8mo ago

Solved, Solution : Add error_page 404 /index.html; to Nginx Routing config

location / {
                try_files $uri $uri/ =404;
                error_page 404 /index.html;
        }

location / {
                try_files $uri $uri/ =404;
                error_page 404 /index.html;
        }

because React Client routing can't handle itself.

Gaming

Programming

React Build page