GrapesJS 问题

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

找到 877 个问题

🔍 question
#45122022年8月15日作者 mingodad3 个回答
0 个反应

本页几乎所有示例都用葡萄失败

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 版本 103.0.5060.134(官方构建)基于 Ubuntu,运行于 Ubuntu 18.04(64 位) 可复制演示链接 https://alvarotrigo.com/blog/html-css-tabs/ 描述一下那个虫子 测试上述示例时没有切换或显示标签页内容 https://alvarotrigo.com/blog/html-css-tabs/ 比如这个“4”。“动画HTML和CSS标签页”准备导入,下面显示: 行为准则 [X] 我同意遵守本项目的行为准则

mingodad

我查了一下,发现了一个已关闭的问题 https://github.com/artf/grapesjs/issues/2873 基于它,我这样做允许预览模式下勾选/无线电: 现在至少在预览中复选/无线电能用,一些演示也能在“预览”中运行。 如果这些信息能包含在文档里就太好了!

artf

感谢@mingodad我发布了表单插件的新[版本](https://github.com/artf/grapesjs-plugin-forms/releases/tag/v2.0.5),并增加了对预览的支持。

ClaudeCode

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

#45062022年8月10日作者 tyuterry4 个回答
0 个反应

拖拽模式下的拖拽块错误:绝对

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v103 可复制演示链接 https://stackblitz.com/edit/js-1xpo7b 描述一下那个虫子 如何复现这个漏洞?使用dragMode:绝对(设计师模式)从块管理器中拖拽块 无法在[JSFiddle](https://jsfiddle.net/g1reyutd/)上复现,但我不知道怎么做。 我猜CDN的Grapesjs和NPM版本的Grapesjs是不同的。 预期的行为是什么? 没有错误,编辑器也没有卡住 目前的行为是什么? 控制台错误:编辑器未定义,编辑器卡住 ![1660117887338](https://...

artf

谢谢@tyutony问题已经修复了(https://github.com/artf/grapesjs/pull/4487)。不幸的是,现在唯一的解决办法是全局暴露“编辑器”实例('window.editor = grapesjs.init({...})`)

wunksert

@tyutony我也遇到同样的问题,你找到解决办法了吗?看起来这个bug还没修复

artf

@wunksert修复了但还没发布(新版本很快就会发布)

#45032022年8月5日作者 gustavohleal4 个回答
0 个反应

CKEditor 在添加原始 HTML 组件时使用的缺少内联样式

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 v96 可复制演示链接 https://grapesjs.com/demo-newsletter-editor.html 描述一下那个虫子 如何复现这个漏洞?在控制台标签页打开开发者工具运行下面的代码选择新增的文本用CKEditor编辑内容选择另一个组件 预期的行为是什么? 预计会从文本组件内的跨度添加内联样式,这样CKEdittor就能理解文本样式,并在打开时保留这些样式。 目前的行为是什么? 通过“editor.addComponent()”添加原始HTML确实会添加样式,但一旦你编辑文本并模糊,样式就会从它们应有的文本段中移除。这只发生在C...

shkhalid

+1

pety-dc

嘿 我也遇到过类似的问题。我认为情况相当严重,因为通讯和 mjml 演示版都受到了影响。(两者都使用 CKeditor 作为 RTE) 当我导入包含带有样式元素(span)的文本(mj-text)的内容时,导入的内容会被解析,样式元素被识别为独立组件,而不是作为换装文本元素的内容。 示例(根据 mjml.io 有效): 预期结果: ![图片](https://user-images.githubusercontent.com/25766885/230409523-b8b57...

raymondmakz

CKeditor 输出: '<div><span style=“color:blue”>ckeditor 中的部分富文本</span></div>” 解析到编辑器后,可以变成: '<div data-gjs-type=“text”>来自 <span 的一些富文本 style=“color:blue” data-gjs-type=“default”>ckeditor</span></div>' 基本上每个主导者都变成了组成部分。 也许可以让开发者选择是否停止添加子节点作为组件...

#45012022年8月5日作者 udayan462 个回答
0 个反应

[X] 我确认使用最新版本的GrapesJS

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 无演示链接 描述一下那个虫子 你好@artf,能帮我检查这两位吗无法在 Grapesjs 编辑器中手动添加颜色代码导入模态没有任何存档选项行为准则 [X] 我同意遵守本项目的行为准则

artf

如果你无法提供可复现的演示,请不要打开BUG问题。

ClaudeCode

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

#44982022年8月4日作者 ajjuyadav02092 个回答
0 个反应

滚动查看多页

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 勇敢 可复制演示链接 https://codepen.io/etamity/pen/NWpKYPp 描述一下那个虫子 如何使用 pageManager 在 Onscroll 中查看多个页面? 行为准则 [X] 我同意遵守本项目的行为准则

artf

请使用讨论区提问

ClaudeCode

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

#44972022年8月3日作者 benryanwilliams4 个回答
3 个反应

从 v18.4 更新到 GrapesJS v19.5 会导致 Chrome 变得无响应

葡萄JS版本[x] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome 104.0.5112.79可复制演示链接 https://jsfiddle.net/gvrnw2c3/4/描述一下那个虫子 如何复现这个漏洞? 我目前无法用 jsfiddle 重现这个 bug,这让我觉得可能是 Chrome 的问题,但我会继续尝试重现。 Within我的项目,如视频所示: 1)点击一个“条件文本”组件(我添加了的自定义组件类型) 2)点击“打开条件”按钮,然后在屏幕上出现的对话框中点击“应用” 3)将光标悬停在“条件文本”组件上 In JSFiddle(目前没有崩溃,但我会继续测试): 1)点击“Hello World”文...

tyuterry

小提琴(vue)的复刻版 没有Vue我无法复制 [小说](https://jsfiddle.net/6qp48xyn/) 重现问题的步骤:添加文本组件选择文本组件,然后点击底部的“转换为条件”按钮将鼠标悬停在条件文本组件上,然后它会冻结。 好像有什么东西总是在悬浮上一直触发 ![图片](https://user-images.githubusercontent.com/30591406/184062993-73d84ef7-0c07-4832-bd7b-9ac6d3851a...

artf

谢谢大家,我其实通过在Vue里打包这个示例还原了它,但我不太清楚为什么会被困在这个循环里。 乍一看,似乎与Vue的Proxy观察者有关。通过与之前的 Grapesjs 版本对比,似乎并非所有部分都被 Proxies 转换,这避免了卡住。 一个快速的变通方法是把“编辑器”放在Vue之外,防止所有对象都变成代理。 “''js 让编辑; Vue.createApp({ mounted() { editor = grapesjs.init({ ... }); // ... }, /...

benryanwilliams

谢谢@artf,现在在Vue实例外声明编辑器后,一切都完美运行了。

#44962022年8月3日作者 bovealexandre4 个回答
0 个反应

SetStyle(场景风格)

葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome 最新版本可复制演示链接 没有,因为它有太多React等自定义代码描述一下那个虫子 如何复现这个漏洞? 用 setStyles 向编辑器添加更多样式 这是我在 setStyles 里用过的字符串 “''CSS .test { 显示:方块; } .test .hide { 显示:无; } .btn { 背景:白人; } 新鲜 { 背景:白人; } .fresh .fresh-2 { 边框:1px 红色实心; } 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: 无需代码测试,只需 edit API 中的 setStyle 即可行为准则[X]...

bovealexandre

当我试图添加这个时 它只是增加了这一点

artf

@bovealexandre至少提供一个简易可复现的例子,因为从我目前看到的情况来看,可能是你的自定义代码导致的

bovealexandre

@bovealexandre至少提供一个最小可复现的例子,因为据我目前看到,可能是你的自定义代码导致的 好的,我刚刚在我的scss编辑器上做了editor.getCss({ keepUnusedStyles: true }

#44952022年8月3日作者 TechyMS1 个回答
0 个反应

按钮组件不工作

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 预期的行为是什么? 按钮组件不工作。行为准则 [X] 我同意遵守本项目的行为准则

ClaudeCode

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

#44892022年7月30日作者 contentfree4 个回答
0 个反应

从设计模式项目加载初始项目数据会导致画布大小错误

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v103 可复制演示链接 https://codesandbox.io/s/laughing-austin-k12mc3?file=/index.js 描述一下那个虫子 如果你查看链接的 CodeSandbox,并找到那条注释出的代码,将 projectData 提供给编辑器,你会发现画布的大小被调整成了设备指定的大小之外。在调试器中,'updateDim' 在初始化时会多次调用:第一次是正确的设备大小,第二次是空的宽度和高度,这会导致 gjs-frame-wrapper 的尺寸被移除。 行为准则 [X] 我同意遵守本项目的行为准则

contentfree

我可以通过以下方式强制调整到正确的画布尺寸:初始配置中未提供 projectData,通过“editor.loadProjectData(...”)加载 projectData(...)在初始化和然后运行编辑器。Canvas.getModel().updateDevice();'虽然它会从全宽动画回到设备大小。 看起来加载项目数据是在默认设备渲染(可能)之后,某种程度上会压缩当前帧,重新渲染一些默认画面。(我不知道默认配置是什么,因为我只提供了一个设备配置,而第二个渲染时似...

artf

谢谢@contentfree我会尽量在下一次发布时修复这个问题

contentfree

谢谢@artf。我会留意下一次发布(看起来你的看板现在空了......所以应该很快就会被发现?)

#44812022年7月27日作者 skru2 个回答
0 个反应

V0.19.5 破坏无头编辑器.setComponents()(带有地图/视频块)

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 102.0.5005.115(官方版本)(64位) 可复制演示链接 描述一下那个虫子 这是#4473的延伸 在无头环境中通过editor.setComponents()添加地图或视频块时,也会出现类似的“文档未定义错误”,源自./src/dom_components/model/ComponentImage.js,parseUri() 尝试使用文档对象。 我不得不迅速修复,因为这是产品发布的阻碍。我重构了 parseUri() 方法,使其看起来像这样(测试通过且无错误): parseUri(uri) { 令 uriParams = {...

artf

谢谢@skru我其实已经处理好了 parseUri [这里](https://github.com/artf/grapesjs/commit/f61222ec904ed56794f7b97e362ea2006dfceaf6),所以下次发布应该能用

ClaudeCode

谢谢你举报,@skru。 v0.19.5 导致 headless editor.setComponents()(带地图/视频块) 的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复...

浏览所有主题