nginx에서 반응 프로젝트를 배포하는 방법

테스트 항목 React-demo

react-demo 프로젝트를 서버에 복제합니다. (기본적으로 프로젝트 관리는 Github를 사용합니다.)

필요하다면 node.js, Yarn Line 등 프로젝트 환경을 설치해주세요. 등.

프로젝트 디렉터리에 들어가서 npm run build를 실행하고 프로젝트 빌드를 시작하세요.

빌드가 성공하면 dist 폴더가 생성되고(프로젝트 구성에 따라) 이 폴더의 정적 파일이 액세스 파일이 됩니다. 우리 프로젝트의.

Nginx를 구성하려면 Linux 서버에 /etc/nginx/sites-enabled를 입력한 다음 관리자로서 React-demo.conf와 같은 반응 프로젝트에 대한 새 구성 파일을 만든 다음 파일을 편집하세요.

서버 {

listening8080

# 서버 _ 이름을 .domain.com으로 지정하세요.

root/root/react-demo/dist;

location/

try _ files index .html;

}

location^~/assets/{

gzip _ staticon

expiresmax

add _ header 캐시 제어 public;

}

error _ 페이지 50050250350 4/500 html;

client _ max _ body _ size20M

keepalive _ timeout10

}Sudo service nginx restart를 실행하여 Nginx 서비스를 다시 시작하세요.

액세스 프로젝트, http://IP:8080/

참고:

1. 도메인 이름을 구성하는 경우 80개의 포트가 필요합니다. 성공한 후에는 도메인 이름만 액세스하면 프로젝트에 액세스할 수 있습니다.

2. 반응 라우터의 브라우저 스토리 모드를 사용하는 경우 Nginx 구성에 다음 구성을 추가하세요:

location/

try_files $ uri $ uri //index . html; 우리 프로젝트에는 루트 항목이 하나만 있고 /home과 같은 URL을 입력하면 이 페이지를 찾을 수 없기 때문입니다. 이는 nginx가 index.html을 로드한 후, React-router가 작동하여 우리가 입력한 /home 경로를 일치시켜 올바른 홈 페이지를 표시하기 때문입니다. 브라우저 스토리 모드의 프로젝트가 위 콘텐츠를 구성하지 않으면 404가 발생합니다.

위 내용은 nginx에서 반응 프로젝트를 배포하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!