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 545

🔍 typescript
#49126 de febrero de 2023por lexoyo3 respuestas
Reacciones 1

Enlaces rotos en la documentación

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Cualquiera Enlace de demo reproducible no Describe el bicho Desde el cambio de artf a GrapesJS, creo que muchos enlaces siguen al repositorio original https://github.com/GrapesJS/grapesjs/search?q=artf ¿Debería intentar r...

lexoyo

Hice un récord personal, espero no haberme perdido nada, tuve que probar casi todos los enlaces

artf

Creo que algunas cosas están redirigiendo, pero otras pueden estar rotas, agradecería un departamento de relaciones públicas si alguien está dispuesto a ayudar 🙏

ClaudeCode

Gracias por informar de esto, @lexoyo. El problema con enlaces rotos en la documentación parece ser una condición de carrera o un problema de sincronización de gestión estatal. Esto suele ocurrir cuando los eventos del ciclo de vida de los...

#49066 de febrero de 2023por panditlakshya2 respuestas
Reacciones 0

Grapesjs no reconoce los tipos de componentes al configurar innerHTML mediante script.

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chrome v108.0.5359.98 Enlace de demo reproducible https://codesandbox.io/s/grapes-js-template-literal-forked-6kgvrb?file=/src/App.js Describe el bicho Estoy intentando crear un componente personalizado que reconozca los t...

artf

Lee detenidamente esta guía, todo lo que está dentro del 'script' está fuera del alcance del editor. Puedes actualizar el propio componente usando el método component.components o especificar directamente el 'components: '<div ....'' en la...

ClaudeCode

Gracias por informar de esto, @panditlakshya. Buena pregunta sobre Grapesjs no reconoce los tipos de componentes al configurar innerHTML mediante script.. El enfoque recomendado con Canvas es usar la API orientada a eventos. Empieza aquí:...

#49005 de febrero de 2023por handhikadj2 respuestas
Reacciones 0

SetStyle/getCss() produce css duplicado

Versión GrapesJS[X] Confirmo que se debe usar la última versión de GrapesJS¿Qué navegador usas? Última versión de ChromeEnlace de demo reproducible https://codesandbox.io/s/silent-river-ifczcvDescribe el bicho ¿Cómo reproducir el bicho?Visita el lugarVer consola. Presta atención al selector '' y 'body' Resultado esper...

artf

Se aplican estilos predeterminados que puedes desactivar fácilmente (pasar una cadena vacía) https://github.com/GrapesJS/grapesjs/blob/a83847b1b35e69e5a5810ccf1eb1e1384bf0aab1/src/editor/config/config.ts#L143-L147

ClaudeCode

Gracias por informar de esto, @handhikadj. Buena pregunta sobre setStyle/getCss() produce css duplicado. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de GrapesJS de tu...

#48973 de febrero de 2023por rudacs4 respuestas
Reacciones 1

Component:styleUpdate / component:styleUpdate:propertyName no activado

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Edge 109.0.1518.70 Enlace de demo reproducible https://jsfiddle.net/rudacs/kr2x1mnh/ Describe el bicho ¿Cómo reproducir el bicho?Cambiar alguna propiedad en StyleManager.Cambiar la propiedad de ancho en el StyleManager. ¿...

artf

Oye, ¿@rudacs has probado en su lugar a usar 'style:property:update'?

rudacs

Este evento funcionó. ¿Se cambió por este? ¿Y para una sola propiedad? ¿Cómo puedo cambiar qué componente y propiedad había antes? Tranquilizantes.

SagarMaria

He venido aquí porque tengo el mismo problema. Usar la sugerencia 'style:property:update' parece funcionar, pero por alguna razón se dispara en cada clic. Además, ¿cómo podemos dirigir un cambio de propiedad de estilo concreto, es decir, '...

#486826 de enero de 2023por LukasSouza2 respuestas
Reacciones 1

Las cajas flotadas muestran desalineadas tras cambiar la posición del editor

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Chrome 109.0.5414.87 Enlace de demo reproducible https://jsfiddle.net/o45ncveu/6/ Describe el bicho ¿Cómo reproducir el bicho?enlace de violín abiertoPasar el cursor sobre algunos componentes antes del tiempo de esperaesp...

artf

Desafortunadamente, esto es lo esperado, tienes que usar 'editor.refresh()' después de los cambios de diseño "externos".

ClaudeCode

Gracias por informar de esto, @LukasSouza. 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...

#485920 de enero de 2023por zoilorys2 respuestas
Reacciones 0

Editar la propiedad CSS establece un estilo a una clase común en lugar de elemento

Versión GrapesJS[X] Confirmo que se debe usar la última versión de GrapesJS¿Qué navegador usas? Chrome v108Enlace de demo reproducible https://grapesjs.com/demo.htmlDescribe el bicho ¿Cómo reproducir el bicho?Configurar el editor grapesjsImportar la siguiente plantilla https://pastebin.com/d9S2M0iSEn la parte inferior...

artf

Solo tienes que activar esta opción: https://grapesjs.com/docs/modules/Selectors.html#component-first-selectors

ClaudeCode

Gracias por informar de esto, @zoilorys. Buena pregunta sobre Editar la propiedad CSS establece un estilo a una clase común en lugar de element. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Cons...

#485519 de enero de 2023por ronaldohoch4 respuestas
Reacciones 1

El esquema desaparece tras aplicar loadProjectData

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Versión de Brave Enlace de demo reproducible https://grapesjs.com/demo Describe el bicho ¿Cómo reproducir el bicho?Abrir la página de demostraciónAbre las herramientas de desarrolloEjecutar: 'let projectData = editor.getP...

allenhwkim

@ronaldohoch con el navegador Edge, funciona con el comando que has dado. 'let projectData = editor.getProjectData();' 'Editor. DomComponents.clear();' 'editor.loadProjectData(projectData);' No creo que GrapesJS soporte el navegador Brave,...

ronaldohoch

También ejecuté el comando 'editor.runCommand("core:component-outline")' y no volvió a aparecer, tuve que hacer dos veces clic en el botón para que apareciera

ronaldohoch

Hola @allenhwkim, gracias por el comentario. Pero es vergonzoso que no lo haya probado en otros navegadores. Creo que mis clientes no usan Brave, así que voy a dejar esa parte. Sin embargo, haciendo todas estas pruebas, conseguí que funcio...

#485117 de enero de 2023por chaegumi3 respuestas
Reacciones 0

This.on('change:attributes:type', this.handleTypeChange) no soportan tipo de array

Versión GrapesJS[X] Confirmo que se debe usar la última versión de GrapesJS¿Qué navegador usas? Chrome 108.0.5359.125Enlace de demo reproducible https://codesandbox.io/s/frosty-darkness-7po7xlDescribe el bicho ¿Cómo reproducir el bicho?usar myBlockHaz clic en el botón de prueba ¿Cuál es el comportamiento esperado? thi...

artf

Los oyentes no ven cambios profundos, así que en ese caso tienes que crear un nuevo array '''js component.set(this.traitName, [... this.items]); ```

chaegumi

Gracias @artf. Yo uso JSON.stringify y JSON.parse para gestionar mis datos.

ClaudeCode

Gracias por informar de esto, @chaegumi. Buena pregunta sobre this.on('change:attributes:type', this.handleTypeChange) no soportan tipos de array. El enfoque recomendado con Componentes es utilizar la API orientada a eventos. Empieza aquí:...

#484816 de enero de 2023por NicoGGG2 respuestas
Reacciones 1

El contenido de los componentes se establece en cadena vacía tras la edición en línea

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Firefox v91.4.1 Enlace de demo reproducible https://grapesjs.com/demo.html Describe el bicho ¿Cómo reproducir el bicho?Ve a la demo básica de grapesjs: https://grapesjs.com/demo.htmlDespejar el lienzoAñadir un enlace de c...

artf

Esto es de esperar debido a cierta lógica relacionada con el editor de texto enriquecido. Puedes usar 'component.getInnerHTML()' para obtener el HTML interno o 'component.components()' para obtener componentes internos.

ClaudeCode

Gracias por informar de esto, @NicoGGG. Buena pregunta sobre El contenido de componentes se configura como cadena vacía tras la edición en línea. El enfoque recomendado con Canvas es usar la API orientada a eventos. Empieza aquí: Consulta...

#483710 de enero de 2023por quentin-bettoum4 respuestas
Reacciones 4

Los IDs de elementos HTML se incrementan en diferentes páginas cargadas en projectData

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Firefox 109 Enlace de demo reproducible https://grapesjs.com/demo.html Describe el bicho Hola, He notado que cuando cargo varias páginas en el projectData que tienen el mismo 'id' que se usa en el HTML, Grapes incrementa...

artf

hola @bgrand-ch, creo que algún día todas las entidades de Grapesjs tendrán un 'UID' global, así que a largo plazo esperaría que este problema se solucionara 🤞

quentin-bettoum

Al principio, quería generar todas las páginas juntas para tener una única salida CSS para todas ellas. Pero ahora estoy probando otra solución para los estilos. Así que para el problema del 'id', generar cada página por separado podría se...

bgrand-ch

Grapes para usar algunos atributos de datos (algo como 'data-uvas-id') como identificadores únicos para dejar el id libre para algunos scripts de frontend. Me gusta esta idea 💯

Explora todos los temas