我在 react-redux 样板中出现导入导出错误

Question

当我尝试使用 npm start 运行我的 react-redux 应用时，它显示 Attempted import error: 'store' is not exported from './app/store'..错误在我的 index.js 文件中。

这是我的 store.js 文件

store.js

import { configureStore } from '@reduxjs/toolkit';
import counterReducer from '../features/counterSlice';

export default configureStore({
reducer: {
counter: counterReducer,
},
});

这是我的 index.js 文件

index.js

import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import { store } from './app/store';
import { Provider } from 'react-redux';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>,
  document.getElementById('root')
);

serviceWorker.unregister();```


  [1]: https://i.stack.imgur.com/F1e6q.png

Answer 1

改用这个：

import store from './app/store';

这是因为在您的 app/store 中，您在对象上使用 export default。
默认导出的对象，不需要在大括号内指定。

阅读 this documentation 的顶部以查看各种语法样式。

如果要从 app/store 文件导出另一个对象，则必须按以下方式指定它：

import store, { anotherObj } from './app/store';

Answer 2

您的导入和导出不匹配。

store.js 正在执行 default 导出：

export default configureStore()

但是 index.js 正在执行 named 导入：

import { store } from './app/store';

您需要在两侧使用相同的图案。 export default configureStore() 和 import store，或者 export const store = configureStore() 和 import {store}。

Answer 3

您在 index.js 文件中为 store.js 导入的内容应该是这样的：

import store from './app/store.js'; (Changes according to your file structure).

但不要使用括号。

我在 react-redux 样板中出现导入导出错误

I have an import export error in react-redux boiler plate

javascript

reactjs

redux

redux-thunk

react-redux