inflearn logo
강의

講義

知識共有

Webゲームを作って学ぶReact

2-9. Webパックデブサーバーとのホットリロード

2-9. 웹팩 데브 서버와 핫 리로딩 설치과정 시 에러

373

yjmm

投稿した質問数 16

0

버그1.JPG버그2.JPG

webpack_config_js1.JPG webpack_config_js2.JPGwebpack_config_js3.JPG

 

 

 

위와 같은 에러가 나오는데

어디 부분을 뒤져야 할지 몰라서 질문드려요

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

[제로초 강좌 질문 필독 사항입니다]
질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.
도움이 되는 질문을 하는 방법을 알려드립니다.

https://www.youtube.com/watch?v=PUKOWrOuC0c

0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.
1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.
2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.
3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.
4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.
5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.
6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.

react

回答 1

0

zerocho

웹팩 버전 문제같은데요. 패키지제이슨 버전 한 번 보여주세요

0

yjmm

package_json.JPG

 

여기있습니다

 

빠른답변주셔서 감사합니다

0

zerocho

new RefreshWebpackPlugin({ overlay: false }) 해보세요

0

yjmm

질문1.JPG질문2.JPG

하고나면 아래와 같은 문구가 뜨는데

[ReactRefreshPlugin] Hot Module Replacement (HMR) is not enabled!

 

이 부분을 구글서치해도 찾기가 힘들어서

 

어떤것을 설치를 안해서 그런걸까요??

0

zerocho

지금보니까 webpack-dev-server가 5버전인데 4버전이어야 합니다.

npm i webpack-dev-server@4

원래 5버전은 깔리지 않는데 어떻게 깔렸는지 의아하네요.

0

yjmm

질문1.

4버전으로 수정 후

npm run dev로 하니까 reload가 잘 되었습니다

하지만 명령어 "npx webpack"로 하면 계속 HMR 이 노란색 에러가 계속 나오네요

npm run dev 와 npx webpack은 리로드 관련되서는 다른 명령어 인가요??

 

 

 

 

 

질문2.

질문2.JPG명령어 "npm run dev" 입력후 위와 같은 에러가 나와서 질문드립니다(리로드는 잘 되는데)

상대경로 뭐 제가 잘못 한거 같은데

어디를 뒤져 보면 알 수 있을까요??

 

 

 

 

항상 빠른 답변 주셔서 감사합니다

 

0

zerocho

  1. 뒤에 serve --env development를 붙이지 않은 명령어입니다.

  2. 이건 설정 및 버전 오류로밖에 안 보이는데 제 깃헙 코드 그대로 써도 에러 나시나요?

0

yjmm

깃헙에서 받아서 해봤는데

똑같은 에러가 나오지만

리로드 localhost8080은 잘되고 리로드도 잘됩니다

 

 

항상 질문에 빠른 답변주셔서 감사합니다

수고하세요

npm run dev 실행 시 포트가 안뜨는 문제

0

202

2

timeouts.current를 useEffect 의 input값으로 넣었을때

0

85

2

렌더링 테스트 코드 (Hooks)

0

80

1

Cannot find package 'react-refesh' 이런 에러 뜨시는 분들 보세요.

0

149

1

해당 에러 뜨는 분들 보세요. "Uncaught TypeError: ReactDom.createRoot is not a function"

1

191

1

강사님 레포지토리에서 코드 복사 시 master 브랜치 말고 react18 브랜치꺼 복붙하세요ㅠㅠ

0

95

1

useMemo와 useCallback 사용 시기

0

205

2

onRightClickTd가 작동을 하지 않습니다.

0

226

1

action.type 불러오는 방식

0

222

2

onClickRedo 질문

0

172

1

const Try = require(./Try) 빨간줄

0

248

1

npx webpack 실행시

0

313

1

지뢰찾기 강좌에서 빈칸들 한번에 열기 파트에서 여쭤보고싶은부분이 있어서 글 올립니다.

0

234

1

강좌에서 다루지 않은 기능들은 어떻게 학습하면 좋을까요?

0

311

1

react devtool이 enable 않됩니다.

0

530

2

React 랜더링이 되지 않습니다.

0

409

2

비동기로 동작하는 setState에 대해서

0

331

1

npm run dev 할 때 에러발생

0

478

2

memo, PureComponenet, shouldComponentUpdate 관련 질문

0

206

1

devMiddleware의 필요성

0

352

1

리액트에서 화살표 함수를 사용해야하는 이유

0

933

2

path.join관련질문

0

281

2

next.js 에서 이와 비슷한 예제를 돌리고있는데 react랑 달라서 질문 드립니

1

490

4

useInterval.js 커스텀 훅에서, 왜 첫번째 useEffect를 계속 반복해야할까요?

0

463

2