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

GrapesJS 问题

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

找到 30 个问题

🔍 undo-manager
#67042026年2月13日作者 mehdimoslehi2 个回答
0 个反应

编辑器崩溃,模板无法加载(TypeError 读取类型)

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 版本 143.0.7499.193 可复制演示链接 https://app.rechat.com/dashboard/marketing/history/Letter?printCampaignId=28f0587d-8738-4fd6-8087-da3167f6d737&action=edit 描述一下那个虫子 如何复现这个漏洞? 打开 Rechat Studio 编辑器,尝试加载/打开这个模板:https://app.rechat.com/dashboard/marketing/history/Letter?printCam...

artf

请提供一个独立且可复现的演示,原因看起来来自你的代码逻辑,而非核心

GJS Helper

GrapesJS编辑器在加载模板时会崩溃并出现TypeError: Cannot read properties of undefined (reading 'type'),原因是你试图加载的内容中HTML格式错误。具体来说,某些div元素有data-block属性但缺少data-type属性,这对GrapesJS正确识别和处理组件至关重要。 根本原因 GrapesJS解析你提供的HTML内容(通过editor.setComponents()或editor.load())来...

#66962026年2月4日作者 jasonvijayy1 个回答
0 个反应

在启用UndoManager的生命周期事件中调用component.replaceWith()时崩溃

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://codepen.io/Logeshwaran-codepen/pen/raLJpYb 描述一下那个虫子 如何复现这个漏洞? 选择canvas中可用的组件。监听生命周期事件(例如 component:selected) 在事件处理程序内调用component.replaceWith() 执行撤销 预期的行为是什么? Undo 应安全恢复编辑器状态且无错误,GrapesJS 应提供支持的生命周期事件中替换组件的方法。 目前的行为是什么? 撤销崩溃是因为GrapesJS试图恢复一个已不存在组件的选择/状态。 问题...

GJS Helper

你遇到的问题是,在GrapesJS生命周期事件中执行同步DOM或组件树操作时,尤其是UndoManager处于激活状态时,是一个常见的陷阱。核心问题在于UndoManager的时序和状态管理。 根本原因分析 当你在component:selected事件处理程序中同步调用component.replaceWith()时,以下事件序列会导致崩溃: 组件选择:在画布中选择一个组件。 事件触发:component:selected事件被触发。 UndoManager 快照:在此点...

#66872026年1月13日作者 rhaarhoff1 个回答
0 个反应

依赖:主干撤销已弃用(NPM)——有什么替代方案吗?

GrapesJS版本 0.22.14(最新版本截至2025-11-20) 预期的行为是什么? GrapesJS 安装树中没有弃用依赖(或替换指南/路线图)。 现在的行为如何? 安装[email protected]会发出npm/pnpm弃用警告,因为它依赖于[email protected](在npm上弃用)。 繁殖步骤 PNPM [email protected](或 NPM I [email protected]) 注意主干网[email protected]的弃用警告 补充背景 这本身不是漏洞报告;这是维护/支持风险(供应链问题)。 相关历史问题:#3443 涉及下划线咨询路径;本报告专门讨论软件包弃用状态。 问题:是否有计划移除或替换骨干...

GJS Helper

安装GrapesJS时对[email protected]的弃用警告是关于依赖维护的一个合理担忧。让我们来分析一下情况及其对GrapesJS用户的影响。 根本原因:弃用依赖 GrapesJS 目前利用 backbone-undo 作为其核心的撤销/重做功能。该库提供了管理编辑器内更改历史的底层机制,允许用户回退或重新应用操作。backbone-undo包本身在 npm 上被标记为弃用,安装时会触发警告。 影响与风险评估 虽然弃用警告通常应被认真对待,但backbone-...

#61712024年9月24日作者 rhoenerSBS2 个回答
0 个反应

:用UndoManager追踪自定义存储

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v129 可复制演示链接 不适用 描述一下那个虫子 你好@artf, 我目前正在实现一个带有 grapesjs 的编辑器,可以在已有页面旁边添加章节。我实现了一个章节存储,实现了IStorableModule,将章节存储在项目数据中。 我的问题是,让UndoManager跟踪章节更改的最佳方式是什么? 有必要以某种方式扩展ItemManagerModule吗? 行为准则 [X] 我同意遵守本项目的行为准则

artf

大家好@rhoenerSBS请避免打开bug问题。

GJS Helper

GrapesJSUndoManager主要通过监听特定事件,特别是change:state,跟踪编辑器核心模型(组件、样式、页面、资源)的变化。要让它跟踪自定义ChapterStorage模块的变更,该模块实现IStorableModule,你需要明确向编辑器提示,当章节数据被修改时其状态发生变化。这会提示UndoManager捕获整个项目数据的新快照,包括你的自定义章节数据。 以下是详细的做法: 1.建模你的自定义数据(章节) 最佳实践是使用Backbone模型和集合来建...

#61432024年9月10日作者 rhoenerSBS2 个回答
0 个反应

BUG/[问题]:如何在添加/挂载时正确包装组件?

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v128 可复制演示链接 https://jsfiddle.net/fjyk6n4a/2/ 描述一下那个虫子 你好,@artf, 我目前正在尝试将一个组件包裹在一个截面组件中,如果它还没有被包裹的话。我正在连接 component:mount 事件,并将新增组件替换为 section(该组件的子节点是新增的)。 我的代码大致是这样的: 我遇到的问题是UndoManager的栈和实际情况没有完全对齐。添加和封包后,栈有三个条目:移除原始组件、添加部分和添加原始组件。点击撤销时,该部分被移除,原始组件保留。但它有bug,因为它无法...

jasonvijayy

你好,@artf, [可复制链接](https://codepen.io/Logeshwaran-codepen/pen/raLJpYb) 我用'component.replaceWith()'和UndoManager一起运行时也遇到崩溃。 这只发生在编辑器生命周期事件中触发“replaceWith()” (例如 'change:status', 'component:selected', 'component: deselect') 在撤销时,GrapesJS 尝试恢复旧...

GJS Helper

谢谢你举报,@rhoenerSBS。 关于BUG/[问题]:如何在添加/挂载时正确包装组件?的好问题。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('some...

#61422024年9月10日作者 rhoenerSBS2 个回答
0 个反应

页面重做无法正常工作

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v128 可复制演示链接 https://app.grapesjs.com/工作室 描述一下那个虫子 添加页面后,通过撤销删除,再用重做重新添加,页面却无法正常工作。图层管理器在选择页面时不会更新。它也没有移除前的内容,似乎也没有实体,因为无法向该页面添加新组件。我在本地开发中注意到了这种情况,但由于 grapesjs 的 Studio 版本也出现了,我提交了工作室版本的链接以重现此问题。 如何复现这个漏洞?打开 GrapesJs 工作室示例添加页面点击撤销 - >页面从列表中移除点击重做 ->页面再次添加点击重做添加的页面查...

artf

谢谢你的报告@rhoenerSBS

GJS Helper

这确实是GrapesJS的撤销/重做机制中的一个bug,特别是在处理页面添加和删除时。你描述的行为符合“重做”操作后页面内部状态恢复不完整的情况。 根本原因 当页面在GrapesJS中添加时,会创建一个Page模型,关键是会关联一个根 Component(通常是带有 tagName: 'body'的 wrapper),以保存页面的所有内容。当你“撤销”页面添加时,Page模型及其关联的根组件会被移除或销毁。错误发生在“重做”操作期间:虽然Page模型本身被重新添加到编辑者的...

#60872024年8月24日作者 leo-budgetsimple3 个回答
1 个反应

在组件内部HTML被更改后,撤销功能无法正常使用

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? 最新消息 可复制演示链接 https://jsfiddle.net/condsjm1/ 描述一下那个虫子 如何复现这个漏洞?更改组件的内部HTML按CTRL+Z键 预期的行为是什么? 撤销内容 目前的行为是什么? 但内容不会被撤销 描述: 在小提琴上,按下“切换到Hello Planet”的按钮,然后选择编辑器,按CTRL+Z 撤销和重做都不行,但如果你正常改“Hello World”文本,它就能正常工作。 我觉得我改错了内容?如果是这样,修改组件内容并模拟原生行为的最佳方法是什么?行为准则 [X] 我同意遵守本项目的行为准则

artf

UndoManager跟踪的是组件状态的变化,而不是它的DOM。 这应该适用于你的情况,'element.components('Hello Planet')'

leo-budgetsimple

@artf 谢谢!

GJS Helper

你遇到的问题是直接操作组件的 innerHTML 属性,绕过了 GrapesJS内部的变更追踪机制。 GrapesJS的撤销/重做管理器( Editor 实例的一部分)只记录通过自身API或用户在编辑器内操作发生的更改。当你直接设置 component.view.el.innerHTML时, GrapesJS 不知道这个修改,因此不会被添加到撤销堆栈中。 根本原因 GrapesJS 撤销/重做系统依赖于通过 GrapesJS API观察组件模型的变更。当你直接访问并修改DO...

#60472024年8月7日作者 danstarns1 个回答
0 个反应

释放流程

GrapesJS 仓库构建工件发布过程中存在以下问题: 工件应直接来自开发者的机器。- https://github.com/GrapesJS/grapesjs/pull/6041 该过程没有文档 我们有多个软件包要发布,也需要完善的文档。该工单旨在标准化并记录 GrapesJS OSS 仓库的发布流程,使其与行业标准工作流程保持一致。这项工作将确保所有贡献者的一致性、可靠性和易用性。

GJS Helper

GrapesJS发布流程的问题——特别是对开发者机器的依赖以及缺乏文档——凸显了对标准化、自动化和透明工作流程的需求。采用行业标准的CI/CD(持续集成/持续交付)流水线将解决这些问题,确保所有贡献者的一致性、可靠性和易用性。 根本原因分析 核心问题源于缺乏正式化、自动化且文档化的发布流程。依赖单个开发者机器来构建和发布工件会带来若干风险: 不一致: 不同的开发环境可能导致构建输出的差异。 可重复性问题: 很难保证构建能被完全复制。 安全风险: 直接从本地机器发布可能会暴露...

#57422024年3月11日作者 bernesto4 个回答
2 个反应

在Windows 10+上构建

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v122 可复制演示链接 无 描述一下那个虫子 如何复现这个漏洞?将git检查到Windows 10+机器上按照提供的流程构建。 预期的行为是什么? 它应该和*inx系统一样建造。 目前的行为是什么? 该构建因引用 Backbone 的错误而失败: 环境: 这个“可能”和 GrapesJS CLI 有关,我不确定,因为webpack.config.js的改动似乎tsconfig.json没有影响。 我也尝试过直接组装,但似乎 Backbone 可能在使用 cash-dom 而不是 jquery时遇到问题。 这次遇到瓶颈了。 行...

bernesto

是的,我做了所有常规的事情。锁定文件、更新、各种导入方式({}、require、*、full path 等) 不知道为什么,但我弄坏东西的时候,会弄得很厉害。永远是2级或3级辅助,哈哈。 我确实认为问题出在CLI,或者......配合 Backbone-Undo。也许是路径相关的,或者是符号链接,或者...... ̄\(ツ)/ ̄ 总之,我明白“时间”的含义。我已经花了太多时间了,如果你有兴趣告诉我,哈哈

bernesto

说得好。我还没试过其他版本的Node。我会试试这个方法。

artf

是的,构建/服务是由CLI管理的(我们把问题移到那里),但我不确定问题出在哪里(因为没有Windows可以测试🥲)。

#56912024年2月21日作者 codei202 个回答
0 个反应

通过颜色选择器切换背景或文本颜色时,撤销不工作

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Firefox 122.0.1 可复制演示链接 https://grapesjs.com/demo-mjml.html 描述一下那个虫子 如何复现这个漏洞? 官方演示版:https://grapesjs.com/demo-mjml.html在画布上添加一列选择章节进入装饰区,在颜色选择器中选择背景色(注意:不要点击确定按钮)。步骤3后,点击撤销按钮,但不要点击其他地方。 预期的行为是什么?点击撤销按钮后,背景颜色应恢复到之前的颜色 目前的行为是什么?背景色保持不变。 同样的行为也出现在文字颜色上。行为准则 [X] 我同意遵守本项目的行为准则

artf

这大概和mjml插件有关,不是核心,因为我无法复现它(建议你打开相关仓库的问题)。

GJSBlock

谢谢你举报,@codei20。 关于在通过颜色选择器切换背景或文本颜色时取消功能的问题非常好。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somethin...

浏览所有主题