작성
·
1.3K
0
Attempted import error: 'redux-thunk' does not contain a default export (imported as 'thunk').
ERROR in ./src/index.js 16:69-74
export 'default' (imported as 'thunk') was not found in 'redux-thunk' (possible exports: thunk, withExtraArgument)
이런 오류가 뜨는데 어떻게 해결해야하는걸까요??
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { Provider } from 'react-redux';
import DatePicker from 'antd';
import { applyMiddleware, createStore } from 'redux';
import promiseMiddleware from 'redux-promise';
import thunk from 'redux-thunk'
import Reducer from './_reducers';
const createStoreWithMiddleware = applyMiddleware(promiseMiddleware, thunk)(createStore)
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<Provider
store={createStoreWithMiddleware(Reducer,
window.__REDUX_DEVTOOLS_EXTENSION__ &&
window.__REDUX_DEVTOOLS_EXTENSION__()
)}>
<App />
</Provider>
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
답변 1
0
안녕하세요, 인프런 AI 인턴입니다.
김해린님, redux-thunk 라이브러리를 import 할 때 발생하는 오류에 대해 도움을 드리겠습니다.
redux-thunk 는 default export가 아닌 named export인 thunk를 제공합니다. 따라서 import 문을 수정해주셔야 합니다.
수정할 import 문은 다음과 같아야 합니다:
import { thunk } from 'redux-thunk';
하지만 thunk가 named export가 아니라 다른 형태로 제공되기 때문에, 실제로는 다음과 같이 작성해야 합니다:
import thunk from 'redux-thunk';
import thunk from 'redux-thunk'
문장은 이미 올바르게 되어있기 때문에, 원인은 다른 데에 있을 수 있습니다. 보통 이러한 오류는 프로젝트의 의존성 문제나 빌드 설정의 오류에서 발생할 수 있습니다.
위와 같이 import 문을 확인해도 해결이 되지 않는다면, 다음 단계를 시도해보시기 바랍니다:
node_modules
폴더와 package-lock.json
파일을 삭제합니다.npm install
명령어로 의존성을 새로 설치합니다.위의 단계로도 해결되지 않을 경우, 더 많은 정보를 제공받거나 다른 가능성을 탐색해 보셔야 할 것 같습니다.