인프런 커뮤니티 질문&답변
작성한 질문수
vite로 구성한 react 프로젝트 배포하기
작성
·
379
·
수정됨
0
안녕하세요. vite로 react 프로젝트를 구성한 후 도커 컨테이너에서 빌드 후 실행시켰습니다. 하지만 브라우저에서 localhost:80으로 접속 시 '사이트에 연결할 수 없음'이라고 뜨는데요. 무엇이 문제인지 궁금합니다.
Dockerfile
FROM node:20-alpine
WORKDIR /react
COPY . .
RUN npm install
RUN npm run build
ENTRYPOINT [ "npm", "run", "dev" ]
EXPOSE 5173.dockerignore
nodemodules
dist프로젝트 구성
터미널에서 실행한 명령어와 결과
kangg ~/coding/dockerreact docker build -t dockerreact .
[+] Building 4.4s (11/11) FINISHED docker:desktop-linux
=> [internal] load build definition from Dockerfile 0.0s
=> => transferring dockerfile: 207B 0.0s
=> [internal] load metadata for docker.io/library/node:20-alpine 1.4s
=> [auth] library/node:pull token for registry-1.docker.io 0.0s
=> [internal] load .dockerignore 0.0s
=> => transferring context: 94B 0.0s
=> [1/5] FROM docker.io/library/node:20-alpine@sha256:eb8101caae9ac02229bd64c024919fe3d4504ff7f329da79ca60a04db08cef52 0.0s
=> [internal] load build context 0.2s
=> => transferring context: 844.99kB 0.2s
=> CACHED [2/5] WORKDIR /react 0.0s
=> [3/5] COPY . . 0.3s
=> [4/5] RUN npm install 1.5s
=> [5/5] RUN npm run build 0.7s
=> exporting to image 0.2s
=> => exporting layers 0.2s
=> => writing image sha256:8ecf94d45f5b9b25318535c24ab89d9be39d07cfcd3f2a20ec96f32be046bea6 0.0s
=> => naming to docker.io/library/dockerreact 0.0s
What's next:
View a summary of image vulnerabilities and recommendations → docker scout quickview
kangg ~/coding/dockerreact docker run -d -p 80:5173 dockerreact
c0a9eb4afc3a1bf17539def3f49821ee04e017c6e3f8ccfa6c26855422a7d709
kangg ~/coding/dockerreact docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
c0a9eb4afc3a dockerreact "npm run dev" 4 seconds ago Up 3 seconds 0.0.0.0:80->5173/tcp pensive_engelbart답변 1
0
JSCODE 박재성
지식공유자
안녕하세요 새옹지마님!
보여주신 코드로만 봤을 때는 정상적으로 잘 실행시킨 것 같네요~!!
docker logs {컨테이너 ID} 명령어를 통해 어떤 출력 결과가 찍혔는 지 공유 한 번 해주실 수 있을까요?
그리고 docker exec -it 명령어를 활용해 해당 컨테이너 내부로 들어가서curl localhost:5173 라고 입력해서 리액트 서버와 통신이 되는 지도
확인 한 번 해보시고 결과 공유해주실 수 있을까요~??
JSCODE 박재성
지식공유자
해결하셨다니 다행이네요😊👍
이 외로 궁금하신 점 생기시면 언제든 질문 남겨주세요:D
** 참고로 공유해주신 결과에서 bash와 curl이 작동하지 않았던 이유는
구축하신 컨테이너의 내부 환경에는 bash, curl이라는 라이브러리가 설치되어 있지 않아서
실행이 안 됐던 것 같네요!
(제가 테스트 방법을 잘못 알려드렸네요ㅎㅎ;;)
해결했습니다! 컨테이너 내부의 vite.config.js파일을 수정하여 컨테이너가 수신할 ip주소와 port를 지정해주어야합니다. 관련 블로그 링크 달아둡니다. https://arkhyeon.tistory.com/53
안녕하세요! 답변 감사합니다. 말씀해주신 내용 시도 후 공유합니다.
그리고 docker exec -it {컨테이너 ID} bash 명령어를 사용했을 때 다음과 같은 오류가 떠서 docker exec -it {컨테이너 ID} sh 명령어를 사용해봤습니다.(이건 왜 되는지 모르겠습니다.)
docker exec -it {컨테이너 ID} sh 후에 curl localhost:5173 시도
sh를 이용해서 접속해서 그런지 curl 명령어를 사용할 수 없는 것 같습니다!