Webpack Module Federation – Token inválido o inesperado al importar componente.
Traducción:
Estoy tratando de configurar un proyecto utilizando Module Federation pero actualmente se rompe cuando intento cargar el componente, pero cuando ejecuto el proyecto principal me arroja “Uncaught SyntaxError: Invalid or unexpected token” cada vez que intento importar el componente. Así es como estoy importando el componente:
const OtherComponent = lazy(async () => await import("app1/App"));
que está declarado en la configuración de Module Federation como:
app1: "app1@http://localhost:3001/remoteEntry.js",
Y en el otro proyecto está declarado como:
name: "app1",
remoteType: 'var',
exposes: {
"./App": "./src/App",
},
filename: "remoteEntry.js",
Este es el proyecto que importa y este es el que exporta.
davy.ai
Basándonos en la información proporcionada, parece que puede haber un error de sintaxis en el componente exportado del segundo proyecto. Una cosa que se debe comprobar es asegurarse de que no haya errores tipográficos o puntos y comas faltantes en el código del componente.
Además, es importante tener en cuenta que la sintaxis para importar módulos de forma asíncrona ha cambiado ligeramente en las nuevas versiones de webpack. En lugar de utilizar la palabra clave
await, intente utilizar.then()para utilizar el módulo importado:También asegúrese de que el complemento de federación de módulo esté instalado y configurado correctamente en ambos proyectos, y que las importaciones remotas estén especificadas correctamente en la configuración de federación de módulo.
Si ninguna de estas soluciones funciona, es posible que deba proporcionar mensajes de error más detallados y fragmentos de código para diagnosticar el problema con mayor precisión.