Problemas con GrapesJS

Problemas analizados por 3,464 en GitHub 370 resuelto · 90 abierto. Busca, filtra y explora respuestas probadas en batalla.

Se han detectado problemas con 336

🔍 style-manager
#33279 de marzo de 2021por DMSlamRespuesta 1
Reacciones 0

¿Hay alguna forma de mantener el código VML en CSS para mantener algunos estilos alejados de Outlook?

Hola. Cuando intento generar una plantilla de boletín a partir de un código HTML existente con algunas etiquetas de envolvimiento VML <style> , las clases de estilo existentes se procesan bien, aunque cualquier mención de tales VML se elimina del Editor. ¿Podrías dar una pista de una posible solución alternativa? ¿Es...

ClaudeCode

Gracias por informar de esto, @DMSlam. Buena pregunta sobre ¿Hay alguna forma de mantener el código VML en CSS para mantener algunos estilos alejados de Outlook?. El enfoque recomendado con StyleManager es usar la API orientada a eventos....

#33269 de marzo de 2021por devtechk3 respuestas
Reacciones 2

CSS estilo lienzo

Hola chicos, en vez de peinar el init de esta manera... ¿Es posible usar un archivo SCSS en Canvas? Canvas { Style:['FILE. SCSS'] } ¿O simplemente hacerlo más limpio con un solo CSS de entrada? ¡Gracias! ' myComponent.append(<style> cuerpo { antecedentes: RGB(204,204,204); } .footer { posición: absoluta; Inferior: 5mm...

artf

Puedes usar canvasCSS option si no quieres usar archivos.

devtechk

¡Muchas gracias! ¡Este archivo de configuración me va a ayudar mucho!

ClaudeCode

Gracias por informar de esto, @devtechk. Buena pregunta sobre el css de estilo canvas. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de GrapesJS de tu módulo específico...

#33042 de marzo de 2021por SyedHashimShah3 respuestas
Reacciones 2

¿Cómo puedo personalizar la interfaz de usuario de Grapesjs?

Quiero personalizar la interfaz de Grapesjs, pero los archivos js y css están minificados. Por favor, decidme cómo puedo hacer esto. Solo quiero mantener algunos bloques específicos como imágenes, texto, etc. en mi interfaz.

echobinod

Sass se utiliza para generar los archivos css minificados. Puedes cambiar las variables de estilo desde aquí: src/styles/scss/

artf

@SyedHashimShah https://grapesjs.com/docs/getting-started.html

ClaudeCode

Gracias por informar de esto, @SyedHashimShah. Buena pregunta sobre ¿Cómo puedo personalizar la interfaz de Grapesjs?. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de G...

#329427 de febrero de 2021por server1024 respuestas
Reacciones 0

HAZAÑA: Añadir opciones al array de la lista de propiedades en el gestor de estilos

Hola, ¿Cómo puedo añadir buildProps a la lista de propiedades para que, cuando se seleccione una opción, se muestren las propiedades de esa opción? Un ejemplo de lo que intento conseguir en la propiedad flexible. '''javascript { nombre: 'Layout', Abierto: Cierto, buildProps: ['display'], Propiedades: [ { Tipo: 'Radio'...

Ju99ernaut

Creo que puedes mover los proyectos de construcción fuera de la lista de propiedades y aun así conseguir lo que buscas; las propiedades integradas relacionadas con la caja flexible solo aparecen cuando un componente tiene 'display: flex'....

server102

Gracias. Lo he probado pero las propiedades de la cuadrícula no funcionan. Puede que tenga que implementarlo manualmente, pero no estoy seguro de cómo abordar el problema de la mejor manera.

Ju99ernaut

No hay 'buildProps' para propiedades de la cuadrícula, así que tendrás que construirlas desde cero; desafortunadamente, la documentación no tiene mucha información sobre propiedades personalizadas, probablemente tendrás que juntar las piez...

#329326 de febrero de 2021por eikerd2 respuestas
Reacciones 0

Blockmanager: añadiendo DIVs personalizados de clase gjs-block-category / gjs-title

Tengo una lista de categorías y quiero marcar algunas con un estilo diferente dependiendo de si son obligatorias o no. Así que idealmente podría añadir una clase a la div con la clase 'GJS-título' para que diga 'GJS-título requerido-campo' 'this.editor.BlockManager.getCategories();' devuelve un array de todas mis cate...

artf

Hola @eikerd revisando el código, por ahora no veo otra forma de personalizar los DOMs de categorías de bloques si no haces algo por tu cuenta con el DOM (una vez que los bloques están renderizados). Probablemente añadiré la vista al model...

ClaudeCode

Gracias por informar de esto, @eikerd. Buena pregunta sobre Blockmanager: añadir DIVs personalizados de clase gjs-block-category / gjs-título. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consul...

#329226 de febrero de 2021por sudiptochoudhury3 respuestas
Reacciones 1

¿Hay algún evento por componente antes de guardar que el componente pueda escuchar?

Te estoy muy agradecido por esta biblioteca. Contexto: Estoy construyendo un editor donde pretendo definir la mayoría de los componentes a partir de un conjunto existente de componentes de Vuejs que he desarrollado anteriormente y que utilizo en mis aplicaciones. La mayoría de estos son componentes simples y complejos...

Ju99ernaut

No estoy seguro de si existen ganchos así por componente, pero puedes intentar aprovechar la propiedad 'toHtml' de un componente. Ya se ha discutido en otros sitios, así que búscalo en los números, ya que hay bastantes.

artf

Sí, puedes definir tus componentes con una función personalizada 'toHTML'/'toJSON' (en el modelo), para personalizar su salida

ClaudeCode

Gracias por informar de esto, @sudiptochoudhury. El problema con ¿Hay algún evento por componente antes de guardar que el componente pueda escuchar? parece ser un problema de condición de carrera o de sincronización de estado. Esto suele o...

#328923 de febrero de 2021por bgrand-ch4 respuestas
Reacciones 2

Los componentes han perdido sus estilos

Versión: 0.16.41 ¿Puedes reproducir el error de la demo? [X] Sí [ ] No ¿Cuál es el comportamiento esperado? 1) Copiar el componente padre seleccionado (contenedor) al portapapeles. 2) Pegar el componente padre seleccionado (contenedor) del portapapeles (en la misma página u otra página). 3) Todos los componentes manti...

artf

Eso porque has actualizado los comandos originales con tus versiones (incorrectamente). De hecho, si elimino tu plugin de la demo, todo funciona como se espera. Por favor, revisa el comando original de copiar y pegar, deberías clonar compo...

artf

Solo revisa los comandos originales https://github.com/artf/grapesjs/blob/dev/src/commands/view/CopyComponent.js https://github.com/artf/grapesjs/blob/dev/src/commands/view/PasteComponent.js

bgrand-ch

@artf Gracias por tu respuesta. ¿Un enlace, un ejemplo o más explicaciones, por favor? 😅

#328623 de febrero de 2021por abulka3 respuestas
Reacciones 0

HAZAÑA: Teclas y complementos personalizados Codemirror

¿Hay alguna forma de añadir teclas de acceso directo y complementos para el editor Codemirror integrado? Especialmente quiero una tecla rápida para comentar. Hay varios plugins que usan el editor Grapesjs, incluyendo https://github.com/artf/grapesjs/issues/324#issuecomment-330571539 y los plugins personalizados de cód...

abulka

Por fin he conseguido que el 'commentRange' incluido en Grapesjs funcione: debe invocarse directamente en 'cm.commentRange', no a través de 'cm.execCommand'. Además, toma parámetros. Así que pude hacer que funcionara algo de comentario, si...

artf

Sí, creo que no es un problema exponerlo en CodeMirrorEditor.js

ClaudeCode

Gracias por informar de esto, @abulka. Los problemas de seguridad y dependencias son importantes. El equipo de GrapesJS trabaja activamente para mantener las dependencias actualizadas. Para ti ahora mismo: Ejecutar 'npm audit fix' para ver...

#328019 de febrero de 2021por bgrand-chRespuesta 1
Reacciones 0

HAZAÑA: Sin renderizado

¿Qué intentas añadir a GrapesJS? Intento estilizar GrapesJS y posicionar sus elementos (paneles, botones, lienzo, etc.), es molesto anular todos los elementos de estilo. Describe tu solicitud de función Un GrapesJS sin renderizado.Añadir un elemento específico de GrapesJS (paneles, botones, lienzo, etc.) en cualquier...

ClaudeCode

Gracias por informar de esto, @bgrand-ch. ¡Gran sugerencia sobre HAZAÑA: Renderizado! Aunque esta función específica aún no está en la API principal, existen varias formas de lograr un comportamiento similar. Usando el sistema de eventos:...

#327919 de febrero de 2021por abulka2 respuestas
Reacciones 0

¿Cómo hacer que la edición de nodos de texto actualice el contenido de los componentes?

Estoy creando un componente personalizado de 'textarea' y quiero que se comporte como el componente 'text' incorporado, de modo que al editar el textnode en el lienzo de grapesjs se actualice el 'textnode' que se encuentra en '.components'. Y quiero que el componente se exporte correctamente como HTML, por ejemplo, '<...

artf

Hola @abulka, mientras la edición se realiza en la vista, deberías actualizar el modelo de componentes una vez que la vista esté actualizada. Así que debería funcionar con algo así '''js modelo: { ... }, Vista: { eventos: { entrada: 'handl...

ClaudeCode

Gracias por informar de esto, @abulka. El problema con ¿cómo hacer que la edición de nodos de texto actualice el contenido de los componentes? parece ser una condición de carrera o un problema de sincronización de gestión de estado. Esto s...

Explora todos los temas