Issue #2388💬 RespondidoAbierto el 7 de noviembre de 2019por asieradurizReacciones 2

Cómo importar estilos de <link> para renderizarse al arrastrar un bloque a lienzo

Respuesta rápidapor asieraduriz1

Hola @pouyamiralayi Gracias por la respuesta rápida. Sin embargo, esto parecería que no será suficiente, ya que lo que busco es una forma de ver mi componente renderizado con los estilos que quiero, pero también, si exporto el proyecto, incluir estos archivos

Lee la respuesta completa abajo ↓

Pregunta

Mi situación:
Estoy importando poco a poco algunos de mis componentes personalizados de interfaz de usuario en 'ReactJS' a 'GrapesJS'.
Ahora, puedo renderizar el componente correctamente integrándolo con Backbone.
Pero mi pregunta es, ¿puedo usar etiquetas de '<link' para descargar mis propios estilos personalizados, para poder verlos correctamente dentro del lienzo?

He intentado hacerlo, pero sin éxito. No querría descargar manualmente todos los CSS de mi biblioteca de UI, pero si renderizo algún componente, me gustaría que el estilo del componente coincidiera con los estilos importados '<link'.

Respuestas (3)

asieraduriz8 de noviembre de 2019

Hola @pouyamiralayi Gracias por la respuesta rápida. Sin embargo, esto parecería que no será suficiente, ya que lo que busco es una forma de ver mi componente renderizado con los estilos que quiero, pero también, si exporto el proyecto, incluir estos archivos

artf13 de noviembre de 2019

Solo tienes que iniciar el editor con tu '<link>' dentro de la plantilla, se cargará en el lienzo y podrás verlo en tu código de exportación

pouyamiralayi7 de noviembre de 2019

Hola @fasaas puedes inyectar tus estilos globales de esta manera:

const editor = grapesjs.init({
    lienzo:{
        Styles: [ 'https://... 1.css', 'https://... 2.css' ]
    }
})

Lo mismo ocurre con tus scripts personalizados. Más sobre esto aquí ¡Salud!

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.

Explora plugins gratuitos →
Opción premium

Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.

Explora plugins premium →

Explorar categorías de plugins

Ve directamente a las páginas de categorías de plugins en el marketplace.