投稿した質問数 8

1

저도 여기서 한참 헤맸습니다.. 저는 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()
    ]
};

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