작성한 질문수 1

2

-

-

1

여러번 삽질 후 webpack 4.x 에서 드뎌~ React, Babel, Sass 번들 환경 구성에 성공했습니다.

물론 react-hot-loader도 설정에 성공했습니다.

참조하실 분은 https://github.com/coddingbear/webpack4_quickstarter/tree/2005-react-hot-loader 함 보세요.

1

대박송님 처럼 저도 3.0.0 버전에서는 페이지 새로고침이 적용 안되네요.

0

알고보니 추가적으로 수정해야 할 부분이 있었습니다: https://github.com/velopert/react-codelab-fundamentals/commit/bead4c5438cb8c030ac6cbb59d0c6be2c1074511   react hot loader 3 테스트 할 때 localhost 에서 작업해서 새로고침이 되고있었는지 몰랐습니다 _ _   업데이트의 자세한 내용은 https://github.com/gaearon/react-hot-loader/tree/next-docs/docs#migration-to-30 여기 참고하시면 되겠구요,,   조만간 강의 수정 하도록 하겠습니다.    

0

강의 감사히 잘보고 있습니다. 저도 위와 같은 문제가 있습니다. react-hot-loader 버전은 3.0.0-beta.3을 사용중인데 HMR 강의에 추가된 내용을 넣어도 페이지가 새로고침이 됩니다. 몇 시간째 삽질하는데 잘 안풀리네요.

0

HMR 강의에 내용 추가해였습니다 ; )

0

흠.. 그런지도 모르겠네요! 제가 조만간 한번 알아보도록 하겠습니다.

0

react-hot-loader 버전이 3.0.0-beta.1로 설치가 되어서 1.3.0으로 바꾸고 nam install 했더니 해결 되었습니다. 버전 문제인가요?

0

소스를 그대로 복붙했는데도 같은 에러가 나와요..ㅠ

0

혹시, webpack.config.js 파일에서

loaders: ['react-hot', 'babel?' + JSON.stringify({
cacheDirectory: true,
presets: ['es2015', 'react']
})],
이 부분에 react-hot 대신에 react-hot-loader 라고 적으신건 아닌지요?
만약에 아니라면 - 다음 내용과 비교해보세요..

var webpack = require('webpack');

module.exports = {
    entry: './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: {
        loaders: [
            {
                test: /\.js$/,
                loaders: ['react-hot', 'babel?' + JSON.stringify({
                    cacheDirectory: true,
                    presets: ['es2015', 'react']
                })],
                exclude: /node_modules/,
            }
        ]
    },

    plugins: [
        new webpack.HotModuleReplacementPlugin()
    ]
};