인프런 커뮤니티 질문&답변

inflearn1님의 프로필 이미지
inflearn1

작성한 질문수

React로 NodeBird SNS 만들기

제로초님 코드를 따라서도 그대로 복사했는데 이 무슨에러인가요? 몇일째 해결 못하고 있습니다;;

작성

·

809

0


import React from "react";
import withRedux from 'next-redux-wrapper';
import { Provider } from 'react-redux';
import { createStorecomposeapplyMiddleware } from 'redux';
import reducer from '../reducers';
import { composeWithDevTools } from 'redux-devtools-extension';
import Head from 'next/head';
import AppLayout from '../components/AppLayout'

const NodeBird = ({ Component, store }) => {
    return (
        <Provider store={store}>
            <Head>
                <title>NodeBird</title>
                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/antd/3.16.2/antd.css" />
            </Head>
            <AppLayout>
                <Component />
            </AppLayout>
        </Provider>
    );
};

const configureStore = (initialState, options) => {
    const middlewares = []; // 미들웨어들을 넣으면 된다.
    const store = createStore(reducer, initialState);
    return store;
}

export default withRedux(configureStore)(NodeBird);

/!\ You are using legacy implementaion. Please update your code: use createWrapper() and wrapper.withRedux().

TypeError: Cannot read property 'getState' of undefined

    at C:\dev\js\react-project\react-nodebird\ch1\front\node_modules\react-redux\lib\components\Provider.js:31:18

    at Object.useMemo (C:\dev\js\react-project\react-nodebird\ch1\front\node_modules\react-dom\cjs\react-dom-server.node.development.js:1239:19)  

    at useMemo (C:\dev\js\react-project\react-nodebird\ch1\front\node_modules\react\cjs\react.development.js:1521:21)

    at Provider (C:\dev\js\react-project\react-nodebird\ch1\front\node_modules\react-redux\lib\components\Provider.js:30:42)

    at processChild (C:\dev\js\react-project\react-nodebird\ch1\front\node_modules\react-dom\cjs\react-dom-server.node.development.js:3043:14)    

    at resolve (C:\dev\js\react-project\react-nodebird\ch1\front\node_modules\react-dom\cjs\react-dom-server.node.development.js:2960:5)

    at ReactDOMServerRenderer.render (C:\dev\js\react-project\react-nodebird\ch1\front\node_modules\react-dom\cjs\react-dom-server.node.development.js:3435:22)

먼 짓을해도 똑같은 오류입니다. 

답변 2

7

저도 최신버전으로 설치를 해서 따라가니 같은 에러가 있었는데 아래와 같이 수정하니 되네요
제 버전은: "next-redux-wrapper": "^6.0.2",

컴포넌트에 별도의 Provider 설정을 안해도 wrapper에서 자체적으로 Provider까지 래핑해주네요

import React from 'react';
import Head from 'next/head';
import PropTypes from 'prop-types';
import withRedux from 'next-redux-wrapper';
import AppLayout from "../components/AppLayout";
import reducer from "../reducers";
import {createStore} from "redux";


const NodeBird = ({Component}) => {
    return (
      <>
          <Head>
              <title>NodeBird</title>
              <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/antd/4.3.3/antd.compact.css"/>
          </Head>
          <AppLayout>
              <Component />
          </AppLayout>
      </>
    );
}

NodeBird.propTypes = {
    Component: PropTypes.elementType,
    store: PropTypes.object,
}
export default withRedux((initialState, options) => {
    const store = createStore(reducer, initialState);
    return store;
})(NodeBird);

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

https://github.com/ZeroCho/react-nodebird/blob/master/ch8/front/package.json

next-redux-wrapper 등의 버전이 다른 것 같습니다.

inflearn1님의 프로필 이미지
inflearn1

작성한 질문수

질문하기