GrapesJS 问题

artf

@nimisha744该仓库中的问题仅针对核心框架相关的漏洞，演示只是为了展示框架能力。

nimisha744

你能帮我拿到这个代码吗？https://prnt.sc/qAb-i9M5c6SF 顺便说一句，我现在只收到 HTML let html = editor.getHtml（）;另外请提供通讯的选项 图片和侧边栏里我看到的是名字，不是图标，请分享选项配置 那种环境 2024年6月10日星期一 下午5：58 Artur Arseniev @.> 写道： 这个仓库里> @nimisha744 <https://github.com/nimisha744>问题只有核心框架相关的漏洞，...

GJS Helper

你遇到的问题是，图片在 GrapesJS 编辑器中显示正确，但在发送的邮件中显示 src="" 或加载失败，这是处理HTML邮件模板时非常常见的问题。根本原因在于邮件客户端如何处理图片源。 根本原因：电子邮件中的图片需要绝对且公开可访问的网址 与能够解析相对路径或访问本地文件的网页浏览器不同，电子邮件客户端在不同的环境中工作。它们不能： 访问本地文件： 如果你的图片 src 指向本地机器上的文件（例如 file:///C:/Users/YourUser/image.jpg）...

artf

可复现的演示是提交bug报告的必不可少。

GJS Helper

当storageManager.autoload在GrapesJS中设置为false时，编辑器会明确避免加载之前保存的项目数据，包括应用到包装器上的样式（通常默认是<body>元素）。这意味着GrapesJS从一个最小的、未样式化的<body>元素开始，正如你所观察到的，因为它没有从存储中检索任何自定义样式。 这不是个bug，而是禁用autoload时预期的行为。如果你想在autoload: false时包装上显示特定样式（如背景色、图片等），必须在编辑器初始化时明确提供这...

nhan-nguyen-se

@MarceloBD 你是怎么解决这个问题的？我也遇到同样的问题。

GJS Helper

看起来你在GrapesJS中遇到了一个间歇性bug，特别是影响加载和Firefox图层面板。点击图层菜单时的TypeError: model is undefined是一个关键线索，指向编辑器初始化时存在的竞争条件。 根本原因解释 这种间歇性行为最可能的原因，是GrapesJS编辑器初始化过程中出现的竞赛条件。以下是详细说明： 组件模型加载：GrapesJS依赖其DomComponents模块管理画布上的所有组件（元素）。这些组件由骨干模型表示。 图层面板渲染：图层面板（L...

artf

编辑过程中你不能与iframe互动，否则就无法从画布中选择它。 不过预览时你会检查iframe的互动。

GJSBlock

谢谢你举报，@omerson-cruz。 关于无法使用视频组件UI控件的好问题。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something chang...

artf

请提供一个有效且可复现的演示

GJS Helper

你遇到的问题是，使用内部url(#id)引用（如mask="url(#mask012)"或clip-path="url(#myClip)"）的SVG元素在GrapesJS编辑器中无法正确渲染，这是浏览器在<iframe>上下文中解析这些引用时已知的行为。 根本原因 GrapesJS 在<iframe>中渲染画布，以将编辑者的样式和脚本与主页隔离开来。当 SVG 被放置在该 iframe 中时，url(#id)引用相对于<iframe>的文档基 URI 进行了解析。通常，Gr...

artf

谢谢@gladykov，但这和核心无关，只是演示中实现的一个示例行为。

GJS Helper

这是关于GrapesJS用户体验的一个有效观察。你描述的行为不是功能失效的bug，而是用户体验上的不一致，点击已选中的组件后，如果用户手动切换到另一个面板（比如“块”），“设置”面板并不总是能重新激活。 根本原因 当组件最初添加或选择时，GrapesJS通常会激活“设置”或“样式管理器”面板。然而，如果组件已选中，用户随后手动导航到另一个面板（例如“块”、“图层”），GrapesJS会记住上一个激活面板。再次点击同一个已选中组件不会触发通常会强制面板切换回“设置”的“选择变...

GJS Helper

感谢你报告这个问题。你正确地识别了资产管理公司GrapesJS文档中的一个断链。 根本原因： AssetImage.ts文档中提供的链接错误地指向了GrapesJS仓库的dev分支。虽然文件路径src/assetmanager/model/AssetImage.ts正确，但dev分支要么不存在，要么不包含该路径的文件，导致GitHub上出现了404页面。 预期行为与修复： 链接应指向master分支，即AssetImage.ts文件所在的主分支。 链接断裂（文档中）: ht...

artf

谢谢@shapley，这其实和GrapesJS甚至Yarn没什么关系，你得[增加文件系统监视者]（https://stackoverflow.com/a/65347277）。

GJS Helper

你遇到的ENOSPC: System limit for number of file watchers reached错误是Linux系统（包括Ubuntu 24.04 LTS）在处理包含大量文件的大型项目时常见的问题，比如带有nodemodules目录的GrapesJS仓库。这不是GrapesJS或Yarn特有的bug，而是操作系统的限制。 根本原因： 你的操作系统对inotify子系统可以监控的文件和目录数量有默认限制。开发工具如Webpack、Sass和chokid...

Dobby85

通过查看代码，我发现要获得 RTE 功能，我们的新组件必须扩展“ComponentTextView”。 我最初的问题是我做了类似的事情： 而且它采用了我的“基础结构”视图，而不是“文本”组件。我会尝试找个变通办法，不扩展我的“baseStructure”视图。

GJS Helper

你遇到的问题是，通过fromElement: true加载的文本组件无法编辑，即使HTML里有data-gjs-type="text"和editable="true"，这其实是GrapesJS在初始化时处理现有DOM元素的方式。 根本原因 当GrapesJS用fromElement: true初始化时，它会解析你容器内已有的HTML（你是#gjs），并将其转换为内部组件模型。虽然它正确识别了带有data-gjs-type="text"的元素并创建了对应的GrapesJS文本...

vincepv

问题解决了。 我找到了解决办法。 当我启动 grapejs 时，我会用 colorPicker 传递对象配置 const config = { 容器：“#editor”， fromElement： true， 其他配置选项在这里 colorPicker： { 附录：'父'， 偏移：{ 顶部：26，左：-166， }， } }

artf

谢谢@vincepv，可能会因为编辑器容器的渲染方式和位置，全屏命令和颜色选择器的默认配置之间存在冲突。 在大多数情况下，只要把颜色选择器放在同一个编辑器容器里，它们就能正常工作。 “''js Grapesjs.init（{ 容器：“#gjs”， colorPicker： { appendTo： '#gjs' }， // ... }) ```

GJS Helper

你遇到的问题是，当 GrapesJS 处于全屏模式下，颜色选择器被隐藏，这是与堆叠上下文和全屏元素渲染方式相关的常见问题。这不是颜色选择器本身的bug，而是不同元素在页面上叠加方式存在冲突。 根本原因 当 GrapesJS 进入全屏模式（默认情况下，它将 position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; 应用到主容器，通常为 #gjs），它实际上创建了一个覆盖整个浏览器视口...