🔥 딱! 오늘 자정까지 할인! 🔥

한가위 할인이 오늘(17일) 종료 됩니다. 눈여겨 봐왔던 강좌가 있다면 놓치지 마세요~ 🎁

React-hot-loader 가 제대로 동작하지 않아요..

미해결질문
이수정 프로필
이수정 2018.07.04

저도 여기서 한참 헤맸습니다.. 저는 webpack, react-hot-loader 둘다 그냥 최신버전으로 받았는데, 강의 그대로 따라하니까 에러나더라고요..

그래서 깃헙에 있는 것으로 따라가서 또 해봤는데 거기의 웹팩 버전도 4는 아니어서 또 에러... 버전 낮은걸로 바꾸면 될 것 같은데 그러기는 싫어서 나중으로 미루고 계속 그냥 개발 하다가 방법을 찾았습니다!

http://gaearon.github.io/react-hot-loader/getstarted/

위 페이지를 참고하여 해결했습니다.

우선 제 프로젝트의 package.json 안에 있는 웹팩과 리액트 핫 로더의 버전은 아래와 같습니다.

"webpack": "^4.12.1"

"react-hot-loader": "^4.3.3"

우선 스크립트는 요렇게 변경했고요, ( --hot 쓰는 대신 webpack안에 plugin으로 적었습니다.

"dev-server": "webpack-dev-server --mode development"

그리고 webpack파일은 아래와 같습니다.

module.exports = {

entry: {

app: [

'react-hot-loader/patch',

'./src/index.js'

]

},

output: {

path: __dirname + '/public/',

filename: 'bundle.js'

},

devServer: {

hot: true,

inline: true,

host: '0.0.0.0',

port: 4000,

contentBase: __dirname + '/public/',

},

module: {

rules: [

{

test: /\.js$/,

exclude: /node_modules/,

use: [

{

loader: 'babel-loader',

options: {

cacheDirectory: true,

presets: ['es2015', 'react'],

},

}

]

}

]

},

plugins: [

new webpack.HotModuleReplacementPlugin()

]

};

혹 이상한 게 있다면 누구든 댓글달아주세요..!