GrapesJS 问题

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

找到 877 个问题

🔍 question
#65622025年7月9日作者 jsxOverdose3 个回答
1 个反应

移动元素在调整尺寸时会吸附到错误的位置

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 138.0.7204.101 可复制演示链接 https://jsfiddle.net/u3L89ejh/1/ 描述一下那个虫子 如何复现这个漏洞? 调整图像大小 把它拖到画布上的别处 点击其中一个小蓝色缩小方块 观看图像跳跃到不同位置 预期的行为是什么? 应该留在我放的地方 如果顶部/左/右/底部的值没有单位,则将值当作“px”来处理,而不是“%”。 目前的行为是什么? 当你移动图像时,上下两侧的像素值表现良好。 但你一碰到缩放按钮,它就会切换到“%”,然后突然跳到画布上全新的位置。 行为准则 [x] 我同意遵守本项目的行为准则

artf

@jsxOverdose推送了这次新版本的修复:https://github.com/GrapesJS/grapesjs/releases/tag/v0.22.11

jsxOverdose

@artf 在新版本中,还有另一个bug:当你点击Y轴上的缩放手柄时,图片会明显变大。这是试玩版:https://jsfiddle.net/du81zL6r/

ClaudeCode

谢谢你举报,@jsxOverdose。 关于调整尺寸时元素卡扣位置错误的好问题。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something chang...

#65582025年7月3日作者 arustagi1011 个回答
0 个反应

可见以隐藏作品,但反之则不行

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 版本 138.0.7204.50(官方构建)(arm64) 可复制演示链接 https://jsfiddle.net/artur_arseniev/L24hkgm5/ 描述一下那个虫子 如何复现这个漏洞? 添加图层管理器,并使用“grapesjs”:“0.22.8”或“0.22.9”的依赖关系。“0.22.7” 运行正常 预期的行为是什么? 在图层部分设置组件不可见,反之亦然,也就是说,将不可见变成可见应该可以。 目前的行为是什么? 在“0.22.8”和“0.22.9”版本中,“隐形”转“可见”在点击图层部分的组件时无法工作。 如果需要执行某...

ClaudeCode

谢谢你举报,@arustagi101。 安全和依赖性问题很重要。GrapesJS 团队积极致力于保持依赖系统的更新。 为你现在: 运行“npm审计修复”以查看可用的补丁 查看是否有更新的GrapesJS版本,可能已经解决了这个问题 如有稳定版,升级前先测试最新稳定版 如果漏洞非常严重,可以使用“npm audit fix --force”,但请务必彻底测试 理解风险: 在GitHub安全公告中查看具体漏洞详情 并非所有高严重性问题都会影响你的代码路径 某些漏洞仅在特定条件下...

#65492025年6月25日作者 yashvi20264 个回答
1 个反应

无法调整图片大小

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://codepen.io/Harshsne/pen/YPXdgmj 描述一下那个虫子 如何复现这个漏洞? 上传图片 将其切换为移动视图 调整图像大小 ![图片](https://github.com/user-attachments/assets/99f43e87-39bd-488c-8d64-e13ed698d49f) 预期的行为是什么? 在样式管理器中手动更改宽度和高度时,图片会被调整大小。 目前的行为是什么? 无法调整图片大小 原因是在Canvas中调整图像大小时不会添加重要,所以原始样式不会被覆盖。 行...

mosh-tudor

@yashvi2026 那是因为你用了自定义的CSS代码。 去除这一部分: “''js 样式:'.image{最大宽度:100%;@media(最大宽度:480px) {.image {display: inline-block;高度:自动 !重要;宽度:100% !重要;最大宽度:100%;}}, `` 来自“编辑部”。BlockManager.add('image', {'

artf

我确认组件调整现在没考虑“重要”,但我大致会按照@mosh-tudor的建议来做。 你不需要去掉所有“样式”,我猜你需要的就是这个,但我觉得没必要把“!important”放在上面。如果你需要“!important”,问题很可能出在图像组件之外。

yashvi2026

我需要在风格中使用'!important'。 我注意到在其他组件中,当默认样式中包含“!important”时,通过样式管理器添加的样式也会包含“!important”,以确保它们覆盖默认样式。 ![图片](https://github.com/user-attachments/assets/0ce9b9ce-86da-41d5-9795-50221d792bce) 所以,当在样式管理器中手动更改样式时,会添加 !important。 同样地,调整组件大小时,样式也应该加上...

#65432025年6月15日作者 Zedonboy1 个回答
0 个反应

面板未拆除

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 镀铬 可复制演示链接 没有 描述一下那个虫子 如何复现这个漏洞? 来自教程 我的CSS风格 预期的行为是什么? 一块空白画布 目前的行为是什么? ... ![图片](https://github.com/user-attachments/assets/254211eb-876a-496c-b392-48543947df22) 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: “''js 你的代码在这里 ``` 行为准则 [x] 我同意遵守本项目的行为准则

ClaudeCode

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

#65352025年6月6日作者 MikeCraig4183 个回答
0 个反应

BUG(v 1.0.48):粘贴丰富内容会将属性值拆分为单个属性

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 把你的版本从 1.0.48 改到 1.0.47 描述一下那个虫子 如何复现这个漏洞? 从Word复制丰富的内容 将葡萄浆糊制成 我正在使用自架选项 预期的行为是什么? 内容应在编辑器中持续存在 目前的行为是什么? 内容错误 行为准则 [x] 我同意遵守本项目的行为准则

MikeCraig418

补充说明,Grapes 的 HTML 格式内容会消失。HTML存储字符串如下:

artf

你用的是什么富文本编辑器? 你能提供复现它的方法吗(比如我能复制相同的文本)?

ClaudeCode

谢谢你举报,@MikeCraig418。 关于BUG(v.0.48):粘贴丰富内容会把属性值拆分成单个属性,这个问题很棒。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console...

#65272025年5月22日作者 tim-prom2 个回答
1 个反应

内联样式变形导致编辑器冻结

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Firefox 138.0.4 可复制演示链接 https://codesandbox.io/p/sandbox/exciting-lalande-98d5vw 描述一下那个虫子 如何复现这个漏洞? 添加带有内联样式错误组件的页面 编辑器无法加载,整个页面变得无响应。Firefox显示“此页面正在使Firefox变慢”警告 预期的行为是什么? 如果编辑器无法解析CSS,最好在控制台里记录错误,而不是屏蔽整个应用 目前的行为是什么? 编辑器变得无响应 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: “''js 编辑。Pages.add({...

artf

谢谢你的报告@tim舞会

ClaudeCode

谢谢你举报,@tim-prom。 关于排外样式畸形导致编辑器冻结的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something ch...

#65182025年5月14日作者 jaredtmartin2 个回答
0 个反应

入门指南没有按原文显示模块

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 136.0.7103.93 可复制演示链接 https://jsfiddle.net/j826eL51/ 描述一下那个虫子 如何复现这个漏洞? 按照“入门指南”页面的步骤操作 当你进入添加方块时,方块不会出现。 预期的行为是什么? 方块应该会出现 目前的行为是什么? 他们没有出现 这可能和另一个问题有关: https://github.com/GrapesJS/grapesjs/issues/2186 但不知为何,入门功能即使更新了CDN,也无法按原文操作。 行为准则 [x] 我同意遵守本项目的行为准则

artf

谢谢你的报告@jaredtmartin

ClaudeCode

谢谢你举报,@jaredtmartin。 关于入门指南“没有按原文显示区块的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something...

#65152025年5月13日作者 jsxOverdose2 个回答
0 个反应

调整元素大小会影响所有具有相同类的元素

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 136.0.7103.93 可复制演示链接 https://jsfiddle.net/L4pu0tzc/ 描述一下那个虫子 如何复现这个漏洞? 向编辑器添加多个图像元素。 为每张图像赋予相同的类名(例如,class=“shared-class”)。 选择并调整其中一张图片的大小。 预期的行为是什么? 只有选定的图片应该被调整大小,无论共享的类名或其他属性如何。 目前的行为是什么? 所有同类元素都会同时调整大小,即使只选中一个。 系统似乎在设置样式时优先考虑类名而非 ID,导致无意中出现全局样式更改。 行为准则 [x] 我同意遵守...

artf

确保开启此选项:https://grapesjs.com/docs/modules/Selectors.html#component-first-selectors

ClaudeCode

谢谢你举报,@jsxOverdose。 关于调整元素大小会影响所有同类元素的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somethi...

#65022025年4月25日作者 jsxOverdose2 个回答
0 个反应

内联样式覆盖基于ID的CSS规则

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v135.0.7049.96 可复制演示链接 https://jsfiddle.net/bqkLwt8j/ 描述一下那个虫子 当元素具有内联样式且匹配基于ID的CSS规则时,ID选择器的样式会被移除——即使内联样式不会覆盖这些属性。然而,基于类的 CSS 规则不会出现这个问题,因为它们的行为符合预期。 如何复现这个漏洞? 为特定ID添加CSS规则,例如“#frame2 { color: red; }` 添加带有该ID和内联样式的元素,例如'<div id=“frame” style=“font-size: 14px;”>'” 注...

artf

谢谢你的报告@jsxOverdose 下次版本会修复

ClaudeCode

谢谢你举报,@jsxOverdose。 关于内联风格覆盖基于ID的CSS规则,这是个很好的问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('s...

#64942025年4月15日作者 yashvi20261 个回答
0 个反应

反复创建和摧毁会判错

GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://codepen.io/Harshsne/pen/QwwLjBQ 描述一下那个虫子 如何复现这个漏洞? 点击创建,然后快速且反复地摧毁。 调试时,我发现错误由以下代码引起: 未定义的“allcomponents”错误由:(editor.select 代码)引起。 未定义的“最后组件”错误: 将样式添加到组件会触发 stylable:change 事件,如果你的侧面函数仍在运行并且在此期间点击 Destroy,会报错。 ![图片](https://github.com/user-attachments/asse...

ClaudeCode

谢谢你举报,@yashvi2026。 关于创建并摧毁反复出现错误的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something ch...

浏览所有主题