React production using react-app-rewired nginx

I have tried to deploy my app on heroku and it work normally. But when I build my app using react-app-rewired script and deploy it to my server using nginx. When access my app, it still work fine but if I reload page with contextPath: http://35.240.229.243/products it throws 404 error. You can access my app in http://35.240.229.243 to test. I am using react-router with history. Help me thanks

asked Nov 12 at 5:42

Duc Anh Pham

146

Can you show your nginx conf file
– Kyaw Kyaw Soe
Nov 12 at 5:47

I dont use any conf. I just throw build folder to /usr/share/nginx/html
– Duc Anh Pham
Nov 12 at 6:41

u have to use .htaccess file
– Asif vora
Nov 12 at 7:56

@Asifvora can you tell me about this file? thanks so much
– Duc Anh Pham
Nov 12 at 8:38

Please refer here htaccess-guide.com
– Asif vora
Nov 12 at 9:05

add a comment |

asked Nov 12 at 5:42

Duc Anh Pham

146

Can you show your nginx conf file
– Kyaw Kyaw Soe
Nov 12 at 5:47

I dont use any conf. I just throw build folder to /usr/share/nginx/html
– Duc Anh Pham
Nov 12 at 6:41

u have to use .htaccess file
– Asif vora
Nov 12 at 7:56

@Asifvora can you tell me about this file? thanks so much
– Duc Anh Pham
Nov 12 at 8:38

Please refer here htaccess-guide.com
– Asif vora
Nov 12 at 9:05

add a comment |

asked Nov 12 at 5:42

Duc Anh Pham

146

reactjs nginx react-router react-router-v4 antd

asked Nov 12 at 5:42

Duc Anh Pham

146

asked Nov 12 at 5:42

Duc Anh Pham

146

asked Nov 12 at 5:42

Duc Anh Pham

146

asked Nov 12 at 5:42

Duc Anh Pham

146

asked Nov 12 at 5:42

Duc Anh Pham

146

Can you show your nginx conf file
– Kyaw Kyaw Soe
Nov 12 at 5:47

I dont use any conf. I just throw build folder to /usr/share/nginx/html
– Duc Anh Pham
Nov 12 at 6:41

u have to use .htaccess file
– Asif vora
Nov 12 at 7:56

@Asifvora can you tell me about this file? thanks so much
– Duc Anh Pham
Nov 12 at 8:38

Please refer here htaccess-guide.com
– Asif vora
Nov 12 at 9:05

add a comment |

Can you show your nginx conf file
– Kyaw Kyaw Soe
Nov 12 at 5:47

I dont use any conf. I just throw build folder to /usr/share/nginx/html
– Duc Anh Pham
Nov 12 at 6:41

u have to use .htaccess file
– Asif vora
Nov 12 at 7:56

@Asifvora can you tell me about this file? thanks so much
– Duc Anh Pham
Nov 12 at 8:38

Please refer here htaccess-guide.com
– Asif vora
Nov 12 at 9:05

Can you show your nginx conf file
– Kyaw Kyaw Soe
Nov 12 at 5:47

I dont use any conf. I just throw build folder to /usr/share/nginx/html
– Duc Anh Pham
Nov 12 at 6:41

u have to use .htaccess file
– Asif vora
Nov 12 at 7:56

@Asifvora can you tell me about this file? thanks so much
– Duc Anh Pham
Nov 12 at 8:38

Please refer here htaccess-guide.com
– Asif vora
Nov 12 at 9:05

add a comment |

1 Answer
1

active

oldest

votes

First you need to find default nginx conf file and disable it, by default it will be under /etc/nginx/sites-enabled/default

sudo rm -rf /etc/nginx/sites-enabled/default

and create new file under /etc/nginx/sites-available/

sudo touch /etc/nginx/sites-enabled/default/redbox

and use vim or nano to put this text into new conf file redbox,

server {

        listen 80;



        root /usr/share/nginx/html;

        index index.html;



        location / {

            try_files $uri $uri/ /index.html;

        }

}

and enable it

sudo ln -s /etc/nginx/sites-available/redbox /etc/nginx/sites-enabled/redbox

next, make sure that there are no syntax errors in Nginx files,

sudo nginx -t

If no problems were found, restart Nginx.

sudo systemctl restart nginx

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

Thanks. I already make it work correctly with location / { try_files $uri /index.html; }
– Duc Anh Pham
Nov 12 at 10:16

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53256468%2freact-production-using-react-app-rewired-nginx%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

First you need to find default nginx conf file and disable it, by default it will be under /etc/nginx/sites-enabled/default

sudo rm -rf /etc/nginx/sites-enabled/default

and create new file under /etc/nginx/sites-available/

sudo touch /etc/nginx/sites-enabled/default/redbox

and use vim or nano to put this text into new conf file redbox,

server {

        listen 80;



        root /usr/share/nginx/html;

        index index.html;



        location / {

            try_files $uri $uri/ /index.html;

        }

}

and enable it

sudo ln -s /etc/nginx/sites-available/redbox /etc/nginx/sites-enabled/redbox

next, make sure that there are no syntax errors in Nginx files,

sudo nginx -t

If no problems were found, restart Nginx.

sudo systemctl restart nginx

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

Thanks. I already make it work correctly with location / { try_files $uri /index.html; }
– Duc Anh Pham
Nov 12 at 10:16

add a comment |

First you need to find default nginx conf file and disable it, by default it will be under /etc/nginx/sites-enabled/default

sudo rm -rf /etc/nginx/sites-enabled/default

and create new file under /etc/nginx/sites-available/

sudo touch /etc/nginx/sites-enabled/default/redbox

and use vim or nano to put this text into new conf file redbox,

server {

        listen 80;



        root /usr/share/nginx/html;

        index index.html;



        location / {

            try_files $uri $uri/ /index.html;

        }

}

and enable it

sudo ln -s /etc/nginx/sites-available/redbox /etc/nginx/sites-enabled/redbox

next, make sure that there are no syntax errors in Nginx files,

sudo nginx -t

If no problems were found, restart Nginx.

sudo systemctl restart nginx

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

Thanks. I already make it work correctly with location / { try_files $uri /index.html; }
– Duc Anh Pham
Nov 12 at 10:16

add a comment |

First you need to find default nginx conf file and disable it, by default it will be under /etc/nginx/sites-enabled/default

sudo rm -rf /etc/nginx/sites-enabled/default

and create new file under /etc/nginx/sites-available/

sudo touch /etc/nginx/sites-enabled/default/redbox

and use vim or nano to put this text into new conf file redbox,

server {

        listen 80;



        root /usr/share/nginx/html;

        index index.html;



        location / {

            try_files $uri $uri/ /index.html;

        }

}

and enable it

sudo ln -s /etc/nginx/sites-available/redbox /etc/nginx/sites-enabled/redbox

next, make sure that there are no syntax errors in Nginx files,

sudo nginx -t

If no problems were found, restart Nginx.

sudo systemctl restart nginx

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

First you need to find default nginx conf file and disable it, by default it will be under /etc/nginx/sites-enabled/default

sudo rm -rf /etc/nginx/sites-enabled/default

and create new file under /etc/nginx/sites-available/

sudo touch /etc/nginx/sites-enabled/default/redbox

and use vim or nano to put this text into new conf file redbox,

server {

        listen 80;



        root /usr/share/nginx/html;

        index index.html;



        location / {

            try_files $uri $uri/ /index.html;

        }

}

and enable it

sudo ln -s /etc/nginx/sites-available/redbox /etc/nginx/sites-enabled/redbox

next, make sure that there are no syntax errors in Nginx files,

sudo nginx -t

If no problems were found, restart Nginx.

sudo systemctl restart nginx

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

answered Nov 12 at 8:52

Kyaw Kyaw Soe

533211

Thanks. I already make it work correctly with location / { try_files $uri /index.html; }
– Duc Anh Pham
Nov 12 at 10:16

add a comment |

Thanks. I already make it work correctly with location / { try_files $uri /index.html; }
– Duc Anh Pham
Nov 12 at 10:16

Thanks. I already make it work correctly with location / { try_files $uri /index.html; }
– Duc Anh Pham
Nov 12 at 10:16

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

Some of your past answers have not been well-received, and you're in danger of being blocked from answering.

Please pay close attention to the following guidance:

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Ndtyjky