react-hot-loader 사용하기

Donggu(oo)·2023년 1월 19일

webpack

목록 보기
7/7
post-thumbnail

1. react-hot-loader 설치하기


  • npm install react-hot-loader 명령어를 이용해 react-hot-loader를 설치한다.
npm install react-hot-loader
  • 단, 설치 시 하나의 앱에 client와 server가 같이 있다면 client 파일에 들어가서 설치해야 한다.

  • 전역에서 설치 시도 시 에러가 발생한다.

  • client로 들어가서 설치 시도 시 정상적으로 설치가 되는 것을 확인할 수 있다.

2. react-hot-loader 적용하기


1) package.json 설정

  • client의 package.json 파일에서 아래와 같이 "babel" object 내부에 "plugins"를 추가하고, "react-hot-loader/babel"을 추가해준다.

2) 최상위 컴포넌트 설정

  • 프로젝트의 최상위 컴포넌트(App.js)에서 import { hot } from "react-hot-loader";으로 불러와주고, export 시 아래와 같이 hot(module)(App) 형식으로 작성해준다.

profile
FE Developer

0개의 댓글