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 877

🔍 question
#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í:...

#49045 de febrero de 2023por handhikadj2 respuestas
Reacciones 0

GetHtml() produce una estructura inválida cuando hay js dentro

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://jsfiddle.net/snj87o6f/1/Describe el bicho Contexto/Descripción Creo que esto es un error porque necesito guardar y cargar los datos de nuevo con el editor. Parser....

artf

La salida es correcta (comprueba la consola real, no la rota de jsfiddle) y lee detenidamente esta sección, nunca deberías depender de HTML/CSS para cargar el proyecto.

ClaudeCode

Gracias por informar de esto, @handhikadj. ¡Gran sugerencia que getHtml() produzca una estructura inválida cuando hay js dentro! Aunque esta función específica aún no está en la API principal, existen varias formas de lograr un comportamie...

#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...

#486524 de enero de 2023por agreif2 respuestas
Reacciones 0

El valor de asignación de clase '@' del contenido del bloque cambia a signo '-' al usar literales plantilla

Versión GrapesJS[X] Confirmo que se debe usar la última versión de GrapesJS¿Qué navegador usas? Firefox 108.0.2Enlace de demo reproducible No es posible en JSFIDDLEDescribe el bicho grapesjs-cli - 3.0.1 grapesjs - 0.20.3 ¿Cómo reproducir el bicho?añadir un newblock con este literal de plantilla con un atributo de clas...

artf

Actualizaré la función de escape, por ahora puedes proporcionar la tuya propia a través de esta opción

ClaudeCode

Gracias por informar de esto, @agreif. Buena pregunta sobre '@' valor de asignación de clase en el contenido del bloque que cambia a signo '-' al usar literales de plantilla. El enfoque recomendado con GrapesJS es usar la API orientada a e...

#486121 de enero de 2023por edenizk3 respuestas
Reacciones 1

<br/> se está sumando al texto de una sola línea, tras introducir espacio por primera vez en Firefox

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Firefox Enlace de demo reproducible https://jsfiddle.net/8rm5wv2y/1/ Describe el bicho ¿Cómo reproducir el bicho?Página de ejemplo abierta en Firefox (no tiene modificaciones)Haz clic en mostrar código, verás que no hay n...

artf

Desafortunadamente, esto no tiene que ver con grapesjs en sí, sino con cómo Firefox gestiona el texto editable. Supongo que una opción sería cambiar a un editor de texto enriquecido personalizado que no dependa del comportamiento nativo.

edenizk

Gracias por tu respuesta 🙂

ClaudeCode

Gracias por informar de esto, @edenizk. Buena pregunta sobre <br/> que se añade a texto de una sola línea, después de introducir espacio por primera vez en Firefox. El enfoque recomendado con ProseMirror es usar la API orientada a eventos....

#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...

#485419 de enero de 2023por mnutt4 respuestas
Reacciones 1

Exportar 'default' no se encuentra en 'backbone' (el módulo no tiene exportaciones)

Versión GrapesJS [X] Confirmo que se debe usar la última versión de GrapesJS ¿Qué navegador usas? Firefox 109 Enlace de demo reproducible ninguno Describe el bicho ¿Cómo reproducir el bicho? ¿Cuál es el comportamiento esperado? Comienza el servidor de desarrollo. ¿Cuál es el comportamiento actual? Estoy usando node v1...

mnutt

Sí, yo también puedo reproducirlo en 'grapesjs-style-filter', mismos tipos de errores.

mnutt

Pude evitar este error cambiando la pipeline de compilación para que generara javascript más moderno (vía '--targets="> 3%''), aunque eso genera errores de backbone debido al uso de clases es6.

artf

No puedo reproducir en mi lado con una instalación limpia, ¿estás usando la rama de desarrollo?

Explora todos los temas