0

I'm trying to add the React useReducer() hook to an existing Redux project, and after a little bit of refactoring I get a compile error:

export 'default' (imported as 'estateAgent') was not found in './estateAgent'

Other questions about this message, such as Export default was not found explain how to declare a default export, but that's not what I need. This is supposed to be a named export, and I don't know why React is expecting a default.

Here are some relevant code snippets.

The line that causes the error is in index.js:

import {EstateAgent} from '../pages/EstateAgent'

(the curly braces mean that it's a named, not a default, export). EstateAgent.jsx contains a container function which defines:

const EstateAgent = (props) => {...

(Going by a web example I'm reading, I changed the original container class EstateAgent to a function)

and the connector:

export const connectEstateAgent = connect(
  mapStateToProps,
  mapDispatchToProps
)(EstateAgent)

The lowercase "estateAgent" seems to mean a Redux file estateAgent.js which defines actions and a reducer and is imported by EstateAgent.jsx, but doesn't contain any default keyword or any entity actually named estateAgent, so I don't know how the error line came up with that name. e.g.:

export const estateAgentReducer = (state = initialState, action) => {...

So, the question: why is the compiler insisting that I'm trying to import a default export when I don't mean to?

user2084572
  • 331
  • 3
  • 12

1 Answers1

0

The naming syntax I described is completely correct, but I was looking at the wrong import statement in a different index.js file. The "EstateAgent" name was fine, but estateAgent is the name of a reducer method referenced in the redux subdirectory ./src/redux/index.js . I had renamed this too out of an overabundance of caution and the error was at first masked by a different compile error. When I updated the name in that file, it worked:

import {estateAgentReducer} from './estateAgent'

Takeaway: the error message is pretty accurate, but overlapping file names and reuse of component names with different capitalization can be confusing for those like me who are still learning to navigate React.

user2084572
  • 331
  • 3
  • 12