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

GrapesJS 问题

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

找到 743 个问题

🔍 bug
#47922022年12月19日作者 wunksert4 个回答
0 个反应

Drag and drop broken in 20.2

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? Chrome v108可复制演示链接 见下文描述一下那个虫子 如何复现这个漏洞?创建自定义组件将其作为组件和可拖拽块添加到编辑器中在组件添加时将编辑器设置为绝对拖拽模式,丢弃组件后再将该组件本身设为绝对拖拽模式。重置编辑器 预期的行为是什么? 组件保持在放置的位置(这在 v 0.20.1 中正常工作) 目前的行为是什么? 组件会吸附到屏幕右侧(这种行为是在0.20.2版本中新增的) 行为准则[X] 我同意遵守本项目的行为准则

wunksert

确认它在 v0.20.1 中仍然有效,所以看起来回归是在 v0.20.2 引入的

wunksert

组件一旦添加到画布中,也无法再拖曳。

artf

我会为下一次发布准备修复方案。

#47912022年12月19日作者 joukhar2 个回答
0 个反应

即使包含了Touch插件,Block:Drag事件在触摸设备上依然无法工作

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome 桌面版本 108.0.5359.125 最新版本 可复制演示链接 无 描述一下那个虫子 如何复现这个漏洞? 当从块管理器拖拽组件时,事件不会触发。 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: 行为准则 [X] 我同意遵守本项目的行为准则

artf

谢谢@joukhar实际上“阻挡:拖拽”事件存在一些不一致,我会在下一个版本中尝试修复。

GJSBlock

谢谢你举报,@joukhar。 关于block:drag事件在触摸设备上即使包含了触摸插件也无法正常工作,这个问题非常好。推荐的组件方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('s...

#47902022年12月18日作者 clonefunnels3 个回答
0 个反应

旧版本BUG——如果我无法获得帮助让最新版本正常工作......

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 旧版本不行。真希望能升级! 描述一下那个虫子 抱歉,我得勾选发帖框...... 如何复现这个漏洞?...用旧版本的 GrapesJS 因为你无法像我一样让新存储管理器工作。...尝试用移动端优化页面。 预期的行为是什么? ...它会保留你做更改时插入的CSS。 目前的行为是什么? ...事实并非如此。 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: 你只需按下导入按钮,它就消失了。 ![2022-12-1806h1426](https://user-images.githubusercontent.com/9594...

clonefunnels

如果能修复,我不介意继续用旧版本。 或者有人能告诉我如何在不安装Rest API的情况下,像以前那样加载HTML和CSS吗?

clonefunnels

我找到了问题所在。 是grapesjs-parser-postcss.min.js?0.1.1 我用1.0.1替换了它

GJSBlock

谢谢你举报,@clonefunnels。 关于旧版BUG的好问题——如果我找不到帮助让最新版本正常工作......。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => cons...

#47842022年12月14日作者 phamthanhbinh47963 个回答
0 个反应

Bug resize image

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? 108.0.5359.73可复制演示链接 https://user-images.githubusercontent.com/44830209/56891735-89203380-6a8e-11e9-8d42-c530d5aa0ae2.gif描述一下那个虫子 错误调整图像大小 嗨! 我在调整图片大小时遇到了一些问题。 当我放置图片并点击一个调整尺寸的处理程序时,图片不会保持高度,而是扩展到父容器的100%...... 可调整大小:1 作为背景,图像有一个绝对位置。 谢谢大家的帮助!行为准则[X] 我同意遵守本项目的行为准则

MrRainDrop9x

我也有同样的问题,有人能帮帮我们吗?

artf

我建议所有与绝对模式相关的bug请参考[本问题](https://github.com/artf/grapesjs/issues/3770)。

GJSBlock

谢谢你举报,@phamthanhbinh4796。 错误调整图像大小的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原...

#47742022年12月9日作者 edenizk2 个回答
1 个反应

Can't set traits in attributes

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Firefox 可复制演示链接 https://jsfiddle.net/9aj630x7/ 描述一下那个虫子 如何复现这个漏洞?创建一个元素将 data-gjs-traits 属性设置为任意默认特征名,比如 id 或 title,这样整个功能就会被压制 预期的行为是什么? 我预期结果和 data-gjs-traits='' 一样,都是把特质设空 目前的行为是什么? 如果我放别的东西,而不是空绳子,会压坏 grapes 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: 行为准则 [X] 我同意遵守本项目的行为准则

artf

你应该使用正确解析的JSON字符串,比如,'data-gjs-traits='[“id”]'', 'data-gjs-traits=“[]''

GJSBlock

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

#47712022年12月7日作者 henry-mmw3 个回答
0 个反应

GrapesJS doesn't understand '@-webkit-keyframe' CSS rules.

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v108 可复制演示链接 无关联 描述一下那个虫子 在编辑器中添加任何“@-webkit-keyframe”的CSS规则。它会显示为“@media”。 我现在给构建器添加了不少工具,但似乎每次添加任何webkit-keyframe的CSS规则,编辑器都无法理解它们,显示为“@media”。只是想知道它是否支持这个功能,还是我可能只是多心了,或者如果不支持,有没有办法帮你实现?行为准则 [X] 我同意遵守本项目的行为准则

ronaldohoch

我只是来这里开启同样的问题!:( @artf,你可以添加这个代码来检查。 “''js 编辑。CssComposer.addRules(' .animateanimated { -webkit-animation-时长:300ms; 动画时长:300毫秒; -webkit-animation-fill-mode:两者兼用; 动画填充模式:两者兼具; } @keyframes 渐入 { 0% { 不透明度:0 } 到 { 不透明度:1 } } .animatefadeIn {...

artf

报告并修复 [此处](https://github.com/artf/grapesjs/issues/4727)

GJSBlock

谢谢你举报,@henry-mmw。 GrapesJS 不理解 '@-webkit-keyframe' CSS 规则的问题。 似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(Co...

#47652022年12月2日作者 wunksert4 个回答
3 个反应

The documented way to parse @keyframes does not work

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? Chrome v107描述一下那个虫子 如何复现这个漏洞?按照以下说明[这里](https://grapesjs.com/docs/guides/Custom-CSS-parser.html#rule-objects)创建你自己的CSS解析器,并输入@keyframes规则CSS字符串。我用了这里的预建帖子解析器:[这里](https://github.com/artf/grapesjs-parser-postcss/blob/master/src/parser.ts)结构从解析器中导出并与文档匹配(见附图),但没有动画 <img width=...

artf

你好@wunksert之前有个与关键帧相关的问题[这里](https://github.com/artf/grapesjs/issues/4727),已经修复但还没发布。

artf

修复该修复可在最新版本中 https://github.com/artf/grapesjs/releases/tag/v0.20.2

wunksert

@artf太棒了!你知道什么时候会发布吗?

#47632022年12月1日作者 quentin-bettoum2 个回答
0 个反应

_undoexc status open

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? Firefox 106可复制演示链接 https://grapesjs.com/demo.html描述一下那个虫子 你好, 当我从 0.19.5 升级到 0.20.1 时,我注意到用 editor.getProjectData() 得到的页面 JSON 比以前明显更重。 区别在于,在0.20.1中,JSON中的每个组件都包含以下代码: 我猜问题可能是从 [组件被转换成类](https://github.com/artf/grapesjs/blame/143414408e0b6f37645fc07714f142280d88961d/src/dom...

artf

哦,是的,那应该被删除,谢谢。

GJSBlock

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

#47542022年11月30日作者 jasonliang-dev2 个回答
0 个反应

Closing `</script>` tag not escaped for script properties

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome 版本 107.0.5304.122(64 位) 可复制演示链接 https://jsfiddle.net/j5khz1gm/ 描述一下那个虫子 如何复现这个漏洞?创建具有以下默认属性的自定义组件类型:将自定义组件添加到画布中获取带有 editor.getHtml()的页面HTML内容 将HTML插入编辑器外的div 预期的行为是什么? 本以为生成的HTML中会跳出关闭脚本标签。不应该出现警报对话框。 目前的行为是什么? 脚本标签不会逃逸。svg 标签显示在文档中。在本地 HTML 文件中使用下面的代码总是执行 alert(1)...

derciesto

@jasonliang-dev,有最新进展吗?我也遇到同样的问题。

GJSBlock

谢谢你举报,@jasonliang-dev。 关于关闭“</script>'标签未逃脱脚本属性的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.lo...

#47522022年11月28日作者 FaisalShaikhHA3 个回答
0 个反应

带有指针事件的组件:'all'(除封装器外)或可编辑组件可以拖拽并下放到自己身上。

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? Chrome 107.0.5304.121(官方版本)(arm64)可复制演示链接 https://jsfiddle.net/artur_arseniev/aku70f5w描述一下那个虫子 如何复现这个漏洞?尝试拖拽可编辑组件或本身有 pointer-events: all CSS 的组件。它会消失。由于此操作执行无限循环,控制台 Uncaught RangeError: Maximum call stack size exceeded返回错误。即使将可拖 false 设置为可编辑组件,它依然可拖拽。 预期的行为是什么? 可编辑组件不应该像包装...

artf

演示本身有个问题,现在已经修复了(在包装组件中添加了“可拖拽:false”)

FaisalShaikhHA

getCSSS补丁让它始终返回可编辑组件的内容无法正常工作,你能帮我解决这个问题吗@artf 下面的代码(包含在可复现演示链接中)总是返回整个画布或包装器的CSS字符串。

GJSBlock

谢谢你举报,@FaisalShaikhHA。 关于带指针事件的组件:“全部”(除了包装器)或可编辑组件可以拖拽到自己身上,这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change',...

浏览所有主题