PageKit — 可自托管的 GrapesJS 建站工具,附完整源码。 获取抢先体验

GrapesJS 问题

已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。

找到 3,464 个问题

#55702023年12月20日作者 prateekkumar-ec3 个回答
0 个反应

导入按钮是从所有页面移除所有样式。

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome 最新版本 可复制演示链接 无(如有需要,我可以分享视频以便进一步交流) 描述一下那个虫子 如何复现这个漏洞?假设你当前页面上有一些内容,上面有一些样式。现在在同一项目中创建一个新页面。点击编辑器标题上的导入按钮,弹窗保持空,然后点击弹窗的导入按钮。现在去检查第一页。它会丢失所有的CSS。 预期的行为是什么? 如果你在其他页面导入内容,第一页应保持不变。 目前的行为是什么? 一个页面的样式会因另一个页面没有导入任何内容而受到影响。 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: 行为准则 [X] 我同意遵守本项目的行为准则

afrinxnahar

如果你能附上一个视频,那就太好了。我不太确定弹出窗口的空功能

artf

@prateekkumar-ec,这不是核心相关的问题。

GJS Helper

这是与 GrapesJS core:import-code 命令处理空CSS输入时的一个已知问题,尤其是在多页面设置中。当点击导入按钮且弹窗中的CSS输入字段为空时,命令内部执行 editor.setStyle('')。此操作清除 GrapesJS CssComposer中当前活跃页面的所有CSS规则。 根本原因 core:import-code 命令设计用于导入 HTML 组件和 CSS 样式。当你将 CSS 输入留空并点击导入时,命令会收到一个空字符串作为 css 选项...

#55632023年12月18日作者 leo-budgetsimple1 个回答
0 个反应

脚本标签的属性正在画布上被移除。

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? 最新版本的Chrome浏览器可复制演示链接 https://grapesjs.com/demo.html描述一下那个虫子 如何复现这个漏洞? 用这个代码把一个html字符串渲染成 grapesjs (我启用了allowScripts) 这是渲染好的画布 ![图片](https://github.com/GrapesJS/grapesjs/assets/107002063/21087a5d-348b-4e16-a349-43243ac8f2e1) 这是可以导出的HTML字符串图片 ![图片](https://github.com/GrapesJS...

GJS Helper

你观察到脚本标签属性不出现在 GrapesJS 画布上,而导出的HTML中却存在,这是预期且设计中的, GrapesJS 处理非视觉元素,尤其是携带数据的脚本标签。这不是漏洞,而是编辑器内部架构及其专注于提供稳定安全的视觉编辑环境的结果。 根本原因解释 内部组件模型与画布渲染: 当你使用 editor.setComponents()时, GrapesJS 会将你的 HTML 字符串解析到其内部组件模型中。使用 allowScripts: true时, <script> 标签...

#55562023年12月13日作者 pittleCheung2 个回答
0 个反应

课程太多会导致网页崩溃

GrapesJS版本 [X] 我确认使用最新版本GrapesJS 你用的是什么浏览器? 最新版本的Chrome浏览器 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞? editor.addComponents(` <ul class="mb-5 flex list-none flex-row flex-wrap border-b-0 pl-0" role=“tablist” data-te-nav-ref > <li role=“演示”> <a class="my-2 block border-x-0 border-b-2 border-t-0 border-tra...

artf

已经报告并修复了 https://github.com/GrapesJS/grapesjs/issues/5525

GJS Helper

你遇到的问题是,当添加和选择包含大量实用类的元素时(尤其是像Tailwind CSS这样的框架或使用data-[...]属性的组件库),GrapesJS崩溃或无响应,是已知的性能瓶颈。 根本原因 GrapesJS默认会尝试解析 HTML 内容中发现的每个唯一类,并将其注册到内部类管理器中。这些类随后会在样式管理器面板中提供,供选择和取消使用。当添加一个具有极多实用类(例如 px-7 pb-3.5 pt-4 text-xs font-medium uppercase lead...

#55492023年12月6日作者 driskell4 个回答
0 个反应

MJ-预览不可编辑

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? 狩猎17可复制演示链接 https://grapesjs.com/demo-mjml.html描述一下那个虫子 如何复现这个漏洞?https://grapesjs.com/demo-mjml.html查看代码 - 复制MJML导入代码 - 粘贴 MJML 并添加到顶部 <mj-head><mj-preview>Some preview text</mj-preview></mj-head>现在尝试编辑它 <img width=“878” alt=“截图 2023-12-06 at 14 23 53” src=“https://github.co...

artf

这不是核心相关的问题,而且很可能根本不是问题,因为<mj-preview>默认在mjml插件中“''[不支持](https://github.com/GrapesJS/mjml/tree/master/src/components)

driskell

@artf 抱歉,我不太明白。这确实是个详细的问题。这需要在另一个仓库上提出吗?我对这里的内部结构不熟悉,所以不知道GrapesJS/mjml需要支持什么,才能让这个仓库不显示它

driskell

Head中记载: https://github.com/GrapesJS/mjml/blob/master/src/components/Head.ts#L14

#55452023年12月5日作者 AFriboulet-ii1 个回答
0 个反应

拖动组件类型 text trigger “rte:disable”

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? 版本 119.0.6045.200 可复制演示链接 https://jsfiddle.net/d64pkcom/1/ 描述一下那个虫子 如何复现这个漏洞?在 Canvas 中拖拽组件文本观看jsfiddle控制台 预期的行为是什么? 不要触发RTE:禁用 目前的行为是什么? 触发RTE:禁用 https://github.com/GrapesJS/grapesjs/assets/128728949/b7fc7998-aeef-47d5-84f4-af74966d56cf 行为准则 [X] 我同意遵守本项目的行为准则

GJS Helper

你准确地识别出GrapesJS中一个小但意外的行为:当从块面板拖拽新组件(比如文本块)到画布时,触发了rte:disable事件。这确实不是预期的行为,因为富文本编辑器(RTE)只有在之前在所选组件上激活时才应该被禁用。 根本原因 rte:disable事件由GrapesJS RTE模块在其disable()方法被调用时发出。该方法通常在取消选中具有活跃RTE的组件,或编辑者内部状态要求停用RTE时调用。在从块面板拖拽操作时,GrapesJS的内部逻辑可能执行隐式触发“清除...

#55422023年12月4日作者 brenoassp2 个回答
2 个反应

错误 YouTube自动播放

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome 119.0.6045.200 64位 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞?拖拽视频块到画布中点击视频,选择YouTube作为提供者。添加任何视频ID,比如lDK9QqIzhwk,并勾选自动播放选项。点击查看代码按钮,查找生成的iframe。URL大致是: https://www.youtube.com/embed/lDK9QqIzhwk?&autoplay=1&muted=1。 预期的行为是什么? 预期的行为是自动播放生成的HTML视频。 目前的行为...

artf

看起来静音属性在Vimeo上是正确的,但YouTube上不行。我会推修,谢谢。

GJS Helper

感谢你报告这个问题并进行全面调查。你已经正确找到了根本原因和可用的解决方案。这确实是 GrapesJS默认YouTube视频组件中的一个bug。 根本原因分析 问题源于 GrapesJS 用来静音YouTube视频的参数与YouTube的iframe API实际预期参数不匹配。 GrapesJS 目前使用的 muted=1: GrapesJS video 组件在生成 YouTube iframe 的 src URL 时,如果启用“静音”选项,会在查询参数中添加 muted=...

#55362023年11月29日作者 adiux1 个回答
0 个反应

无法添加链接:getModel() 失败,TypeError: $ 不是函数

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome 版本 119 可复制演示链接 https://jsfiddle.net/bj7afw63/1/ 描述一下那个虫子 如何复现这个漏洞?装填小提琴尝试添加默认RTE(非CKE)的链接界面中没有任何变化,控制台出现 JS 错误:TypeError: $ 不是函数 预期的行为是什么? 在 mj-text 组件的界面中添加了一个链接。 目前的行为是什么? 链接未被添加。 我目前发现的 我追踪到GJS方法的错误:[getModel()](https://github.com/GrapesJS/grapesjs/blob/149a9b2ad...

GJSBlock

谢谢你举报,@adiux。 关于无法添加链接:getModel() 失败,TypeError: $ 不是函数,这个问题很棒。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => co...

#55302023年11月25日作者 Harshsne261 个回答
0 个反应

撤销管理器的开始和停止功能没有达到预期效果

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v91 可复制演示链接 https://codepen.io/dhanadsp1120/pen/ExrRvOB 描述一下那个虫子 如何复现这个漏洞?通过调用 um.stop() 禁用撤销管理器。对内容进行修改。使用 um.start() 重新启用撤销管理器。 预期的行为是什么? 按下Ctrl+Z后,系统应恢复到停止撤销管理器前的状态,只显示重新启用后所做的更改。 目前的行为是什么? 按Ctrl+Z会跳转到前一步,表示所有更改都在跟踪,尽管撤销管理器暂时停止。 ![撤销管理器](https://github.com/Grapes...

GJS Helper

你描述的 GrapesJS 撤销管理器(um.stop() 和 um.start())的问题是已知的行为,即尽管 um.stop() 方法将内部 enabled 标志设置为 false,但并不能始终阻止所有内部 GrapesJS 操作将命令推送到撤销栈。这导致在管理器理应停止记录时,仍然被记录在历史中。 根本原因 GrapesJS UndoManager 有一个 add 方法,可以在推送命令到历史栈前检查 enabled 标志。 um.stop() 方法设置 this.en...

#55252023年11月19日作者 duydvu2 个回答
3 个反应

在单个组件中添加超过 20 个类时,性能问题

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Edge v119.0.2151.72 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 你好,感谢你创建了一个了不起的项目。我想报告使用 GrapesJS时发现的一个问题。 如何复现这个漏洞?选择一个组件添加任意名称的类,直到组件超过20个类。选择另一个组件并重新选择该组件。 预期的行为是什么? 不应该有性能问题。 目前的行为是什么? 浏览器会明显卡死一段时间。添加的类越多,卡死的时间越长。当组件有23个类时,我的浏览器会卡顿10秒。 这是使用 TailwindCSS 时常见的问题,因为类很多...

artf

同意建议,我会相应更新。谢谢@duydvu

GJSBlock

谢谢你举报,@duydvu。 关于在单个组件中添加超过20个职业时性能问题的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somethi...

#55232023年11月18日作者 lexoyo2 个回答
0 个反应

当没有选择任何东西时粘贴

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Firefox 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞?选择舞台上的组件用 CTRL+c 复制组件选择实体(取消选择组件)用CTRL+V粘贴 预期的行为是什么? 在正文末尾粘贴当前页面 目前的行为是什么? 由于以下条件,它什么都不做: https://github.com/GrapesJS/grapesjs/blob/8025b95a645907574389e950f32950190ceb602c/src/commands/view/PasteComponent.ts...

lexoyo

注意,这个bug导致无法将元素复制粘贴到空白页面

GJS Helper

你描述的问题是GrapesJS默认 paste-component 命令中的已知行为。根本原因在于命令的实现,特别是其run方法开头的条件if (!selected || !selected.length) return;。如果画布上当前没有选中组件,这个检查会阻止粘贴操作继续。 设计上,默认paste-component命令期望选中的组件决定将复制内容插入的位置(通常是在所选组件旁边)。当没有选择任何内容时,它就没有上下文目标,因此没有任何作用。 为了实现预期行为——在没...

浏览所有主题