웹 프론트/Webpack | Vite2 Vite : React 웹서버 서브 디렉토리 배포 설정하기 React를 통해 빌드를 하고 웹서버에 배포하기 위해서는 웹서버 설정이 추가적으로 필요합니다. 예를 들어, react-router와 같은 브라우저 라우터를 사용하게 되면 모든 경로에 대해 Web Root의 index.html로 rewrite 해주는 명령어가 필요합니다. Nginx의 경우 try_files 옵션을 설정하여야 하고, Apache의 경우 RewriteRule 옵션을 통해 설정할 수 있습니다. 위 설정을 해주지 않으면 새로고침시에 404 에러가 발생하는데, 이는 클라이언트에서 라우팅을 처리할때, 서버에 해당 자원이 없다고 인식하기 때문에 이러한 문제가 발생합니다. SPA에서는 모든 요청을 Base가 되는 index.html에서 처리하는데, 다른 경로로 접속하면 해당 경로에 일치하는 파일을 웹서.. 2024. 6. 11. Webpack : Webpack 빌드후 자동으로 S3로 배포하기 (webpack-s3-plugin) Webpack으로 웹 애플리케이션을 빌드한 뒤에 S3로 업로드를 해야 하는 경우가 있습니다. 보통 S3를 통한 정적 웹페이지 배포를 할 때, 또는 특정한 버킷 위에 Webpack으로 bundling 한 js파일을 업로드해야 할 경우가 있을 때 이러한 경우가 발생하게 됩니다. 수동으로 dist폴더 안에 있는 파일들을 drag-end-drop을 통해 S3로 업로드 할 수도 있지만, Webpack 명령어 사용 후에 자동으로 S3 Bucket에 올려주는 플러그인이 있어 한번 소개해드리도록 하겠습니다. webpack-s3-plugin오늘 설명해드릴 플러그인은 바로 webpack-s3-plugin 인데요, 아래 링크를 누르시면 npm 설명 페이지를 확인하실 수 있습니다. webpack-s3-pluginUploa.. 2022. 7. 22. 이전 1 다음
