inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

Slack 클론 코딩[실시간 채팅 with React]

폴더 구조와 리액트 라우터

build와 dev router 설정

216

윤준서

작성한 질문수 2

0

yarn run dev로 서버를 돌리면 라우터가 제대로 동작하는데, 

yarn run build를 통해서 dist 폴더 아래에 생긴 js 파일을 이용해서 index.html에서 open한 경우 라우터가 제대로 동작하지 않는데, 이유를 알 수 있을까요? historyApiFallback 설정 true로 해뒀습니다. 

htmlplugin을 통해서 dist 아래에 html 파일을 동적으로 생성해줬습니다.

요약하자면 배포를 하려는데, dist 아래에 html이 없어서 생성해주고 build 명령어로 배포를 하는데 라우터 설정이 안되는 상황입니다.

구글링하다가도 해결 못해서 질문 남깁니다 ㅜㅜ 

typescript Socket.io react babel 웹팩 클론코딩

답변 1

0

제로초(조현영)

historyApiFallback은 데브서버에서나 가능한 것이고요. 지금은 빌드했으니까 그 설정은 적용되지 않습니다.

요청은 백엔드 서버로 가므로 백엔드 서버의 api를 제외한 모든 라우터(* 활용하셔도 됩니다)가 index.html을 서빙하게 하면 됩니다.

0

윤준서

감사합니다!

기본 셋팅과 관련하여

0

106

1

초기 셋팅 back과 front만 남겨두고 다 지운 후 진행 방법

0

109

2

focus 시에만 화면 업데이트 되는 이유 + 해결방법

0

165

2

useEffect 개수 관리

0

122

2

라이브러리 서치 방법

0

118

2

함수 정의 패턴

0

80

1

npm run dev 에러

0

156

3

npx webpack 후 에러

0

187

2

'void' 형식 식의 truthiness를 테스트할 수 없습니다.ts(1345)

0

153

2

사용자 가입시 에러발생 (TypeError: Cannot read properties of null (reading 'addMembers')

1

192

2

초기세팅중 packge.json 에러떠요

0

163

2

CORS - Access-Control-Allow-Origin 누락 문제

0

439

3

로그인 페이지 무한 새로고침 현상

0

608

2

Module not found: Error: Can't resolve './App' 에러

0

970

1

배포 방법

0

306

2

npm run dev 시 빌드가 매우 느려졌습니다

0

1011

2

alias 경로 설정 오류

0

462

2

fetcher 함수의 data 값이 두번 찍히는 이유

0

284

1

제네릭 질문

0

225

2

ts-node 대신 tsx 사용여부

0

379

1

배포 관련 질문

0

249

1

[nginx + https] 서비스를 실행하면 niginx가 아닌 서비스 화면을 보여주게 하고 싶습니다.

0

396

2

[배포하기] webpack에 aws 퍼블릭 IPv4 주소 와 포트 주소를 작성하고 나서 빌드후 실행하면 오류가 발생합니다.

0

341

1

users 호출 시 쿠키가 담기지 않는 이슈 질문드립니다.

0

252

2