Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

404
Views
"Uncaught TypeError: WEBPACK_IMPORTED_MODULE is undefined" error after upgrading to create-react-app 5 and Webpack 5

In the midst of upgrading a project from CRA 4 to CRA 5, which bumps Webpack from 4 to 5 in the process. Specifically, the upgrade was from:
react-scripts: 4.0.3 to 5.0.0
webpack: 4.33.0 to 5.68.0

Everything's working except one issue that I'm having no luck tracking down the cause of.

One product within the app uses a set of nested index.ts files to manage exports, so they can be imported in one shot instead of a bunch of individual imports. The sequence looks like this:

//reports-async/containers/AggregatedReportDetail/AggregatedReportDetail.js
export const AggregatedReportDetail = () => {
    ...snip...
}
export default AggregatedReportDetail

-------------------------------

//reports-async/containers/index.ts
...snip...
export { default as AggregatedReportDetail } from './AggregatedReportDetail/AggregatedReportDetail'
export { default as TrendReportDetail } from './TrendReportDetail/TrendReportDetail'
...snip...

-------------------------------

//reports-async/index.ts
export * from './containers'
export * from './components'
export * from './models'
export * from './store'
export * from './types'
export * from './utils'

-------------------------------

//appMenu.js
import {
    AggregatedReportDetail,
    ReportPrint,
    ...snip...
} from './reports-async/containers'

This setup worked with CRA4/Webpack4, but with the update to CRA5/Webpack5, it compiles successfully but throws this error in the browser console:

Uncaught TypeError: _AggregatedReportDetail_AggregatedReportDetail__WEBPACK_IMPORTED_MODULE_4__ is undefined

I found that by changing the import in appMenu.js to directly import from the AggregatedReportDetail.js file instead of the module-level index.ts file, the error goes away (and it throws a similar error for the next imported component). IE, this works:

import AggregatedReportDetail from './reports-async/containers/AggregatedReportDetail/AggregatedReportDetail'

I'm assuming this is likely to be some kind of circular dependency issue or similar, but I can't seem to find any good info on how to resolve this without going back and manually changing 500+ imports to no longer use the index.ts files.

Am I missing something really obvious?

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!