0

He estado intentando instalar las librerías KendoUI y PrimeNG en microfrontends creados con la librería Single-SPA de tipo Angular, pero no lo he logrado.

Funcionan en proyectos únicos de angular pero bajo el framework de single-spa yendo a la url del contenedor no, creo que tiene que ver con webpack mi problema pero no estoy seguro.

¿Hay algún ajuste que deba realizar el proyecto contenedor de single-spa? ¿Tiene que ver con webpack? Si es así, ¿Cómo podría resolverlo?

Cualquier ayuda será bienvenida, les agradezco su tiempo y respuesta!

En una prueba que hice creando un proyecto de Angular inicialmente antes de instalarle el framework de single-spa, si lograba instalar las librerías de forma correcta y se veía reflejado en el diseño, pero luego de configurar single-spa y asociarlos al proyecto contenedor ya se perdía el diseño de las librerías.

Con kendoUI instalo vía npm los componentes de la librería, luego verifico en los estilos de angular.json que estén allí las referencias a la librería y hago algunas pruebas, el proyecto angular como tál si me funcionan los componentes pero con el framework no:

  • npm install --save @progress/kendo-angular-buttons
"styles": [
{
   "input": "node_modules/@progress/kendo-theme-material/dist/all.css"
},
   "src/styles.scss"
],

También intenté importando en main.ts la referencia a las librerías

import '@progress/kendo-theme-material/dist/all.css';
import '@progress/kendo-theme-default/dist/all.css';

Con PrimeNG he hecho generalmente lo mismo que con KendoUI, instalé según su documentación, la librería vía npm e hice el paso a paso pero no se ve reflejado en el diseño la librería usando single-spa.

1 respuesta 1

0

Hola creo que debes arreglar tu angular.json y colocarlo asi

"styles": [
   "node_modules/@progress/kendo-theme-material/dist/all.css",
   "src/styles.scss"
],

te muestro como tengo un proyecto

"styles": [
              "src/styles.css",
              "node_modules/@fortawesome/fontawesome-free/css/all.min.css",
              "node_modules/primeicons/primeicons.css",
              "node_modules/primeng/resources/themes/vela-blue/theme.css",
              "node_modules/primeng/resources/primeng.min.css",
              "node_modules/primeflex/primeflex.css",
              "node_modules/quill/dist/quill.core.css",
              "node_modules/quill/dist/quill.snow.css",
              "node_modules/ngx-toastr/toastr.css",
              "node_modules/ngx-spinner/animations/ball-scale-multiple.css"
            ],

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.