React) Nginx + React (SUB-PATH)로 배포하기

react로 관리자를 만들어 https://example.com/admin 

위의 url 와 같이 뒤에 admin을 붙여 개발한후에 서버에 배포하는 방법을 알아보겠습니다.

Step1 

package.json에 homepage 키값에 value 추가 (저같은경우 /admin 으로 추가하였습니다.)

{
    "name": "ADMIN-Project",
    "homepage": "/admin",
    "version": "1.1.0",
    "private": true,
    "scripts": {
    .....
}

Step2

BrowserRouer Dom에 basename 추가

<BrowserRouter basename="/admin">
.....

 

Step3

Nginx 설정 파일인 /etc/nginx/sites-available/default 에서 아래와 같이 추가

location ^~ /admin {
                alias /home/xxxxx/build;
                #index  index.html index.htm;
                try_files $uri $uri/ /admin/index.html;
        }

 

Step4

nginx 다시 시작 ( 저는 ubuntu 18.04 버전입니다. )

service nginx stop
service nginx start

 

배포완료 끝

 

도움되셨다면 개발자에게 커피를 공급해주세요!!(광고클릭)!!