En medio de la actualización de un proyecto de CRA 4 a CRA 5, que eleva Webpack de 4 a 5 en el proceso. Específicamente, la actualización fue de:
scripts de reacción: 4.0.3 a 5.0.0
paquete web: 4.33.0 a 5.68.0
Todo funciona, excepto un problema del que no tengo suerte para encontrar la causa.
Un producto dentro de la aplicación utiliza un conjunto de archivos index.ts anidados para administrar las exportaciones, por lo que se pueden importar de una sola vez en lugar de un montón de importaciones individuales. La secuencia se ve así:
//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'Esta configuración funcionó con CRA4/Webpack4, pero con la actualización a CRA5/Webpack5, se compila correctamente pero arroja este error en la consola del navegador:
Uncaught TypeError: _AggregatedReportDetail_AggregatedReportDetail__WEBPACK_IMPORTED_MODULE_4__ is undefinedDescubrí que al cambiar la importación en appMenu.js para importar directamente desde el archivo AggregatedReportDetail.js en lugar del archivo index.ts a nivel de módulo, el error desaparece (y arroja un error similar para el siguiente componente importado). IE, esto funciona:
import AggregatedReportDetail from './reports-async/containers/AggregatedReportDetail/AggregatedReportDetail'Supongo que es probable que se trate de algún tipo de problema de dependencia circular o similar, pero parece que no puedo encontrar ninguna buena información sobre cómo resolver esto sin volver atrás y cambiar manualmente más de 500 importaciones para que ya no usen el índice. archivos ts.
¿Me estoy perdiendo algo realmente obvio?