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

GrapesJS 问题

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

找到 743 个问题

🔍 bug
#56212024年1月15日作者 ronaldohoch2 个回答
0 个反应

在空元素上显示占位符时,边界不被考虑

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? Edge 最后版本可复制演示链接 https://grapesjs.com/演示描述一下那个虫子 如何复现这个漏洞?得到一个空元素加高值双边框。(20..30px...)将任意方块移动到其中。![图片](https://github.com/GrapesJS/grapesjs/assets/2287371/5894b9b2-08c1-46f9-a62f-536e221839d1) 预期的行为是什么? 占位符应放在元素中心。 目前的行为是什么? 占位符显示在元素顶部,木板内侧行为准则[X] 我同意遵守本项目的行为准则

ronaldohoch

https://github.com/GrapesJS/grapesjs/pull/5622

GJS Helper

你准确地识别出GrapesJS中一个视觉漏洞,涉及当元素有显著边界时,空元素占位符的位置。这种行为在GrapesJS演示中是可复现的,并影响拖拽操作中的用户体验。 根本原因 根本原因在于默认的 CSS 样式应用到GrapesJS占位符元素上,通常由类 .gjs-placeholder标识。默认情况下,GrapesJS 使用position: absolute; top: 0; left: 0; right: 0; bottom: 0;来定位占位符。这组属性使占位符填充其父元...

#56182024年1月15日作者 Ashwinvalento3 个回答
0 个反应

导入时旧组件脚本不会被删除。导致脚本重复

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Edge v120.0.2210.121 可复制演示链接 https://codepen.io/ashwinvalento/pen/jOJMPqx 描述一下那个虫子 如果我们设置了 config.parser.optionsHtml.allowScripts: true 并创建了一个包含脚本的组件,那么当我们用 grapesjs-preset-webpage 插件导入代码时,脚本标签会被重复。 如何复现这个漏洞? 在演示链接(https://codepen.io/ashwinvalento/pen/jOJMPqx)将“复制脚本块”放入画布。...

artf

直接将 JS 导入为组件从来不可能,所以它被视为一个新的组件。

Ashwinvalento

有没有办法识别现有组件的脚本并在导入时删除它们?我们无法移除所有脚本标签,因为需要保留手动添加的脚本。

GJS Helper

你遇到的脚本重复问题是,在多次导入HTML时,尤其是在 GrapesJS中,尤其是 config.parser.optionsHtml.allowScripts: true,是 GrapesJS 在 setHtml 操作中如何对合组件的已知行为。虽然 setHtml 设计用于替换画布内容,但脚本组件的对账逻辑可能并不总是正确识别和替换现有的相同脚本,导致它们被附加而非更新或移除。 根本原因 当 config.parser.optionsHtml.allowScripts 设...

#56132024年1月12日作者 SachinPuthiyoth1 个回答
0 个反应

StyleManagerConfig.sectors.properties 的类型定义错误

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 没有 描述一下那个虫子 如何复现这个漏洞?根据 https://github.com/GrapesJS/grapesjs/blob/5c890449a52f526bc480d6dc649ff5e01ec59140/src/stylemanager/index.ts#L310 属性的类型 属性类型https://github.com/GrapesJS/grapesjs/blob/5c890449a52f526bc480d6dc649ff5e01ec59140/src/stylemanager/config/config.t...

GJS Helper

你准确指出了GrapesJS中的类型定义不一致。问题源于src/stylemanager/config/config.ts中StyleManagerConfig.sectors.properties声明的类型与其实际用法及预期类型不匹配,意图类型是PropertyTypes(Property对象数组),如 src/stylemanager/index.ts所示。 根本原因 StyleManagerConfig接口,特别是sectors性质,定义为SectorProps[]。...

#56072024年1月10日作者 Ju99ernaut2 个回答
0 个反应

无法扩展之前空过的图层

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v120.0.6099.199 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞?将第1列方块拖到画布上将任何其他块拖入单元格,例如文本选择单元打开图层面板 预期的行为是什么? 我们应该能够展开单元格,并通过图层选择单元格内的元素 <img width=“1438” alt=“截图 2024-01-10 下午5 42 36” src=“https://github.com/GrapesJS/grapesjs/assets/48953676/043150f3-9c7...

artf

说得好,我会修好的

GJS Helper

这是GrapesJS中已知的一个漏洞,与图层面板(特别是Layer视图)对组件子集合变化的反应有关。问题出现在组件(如列或单元格)最初是空的,然后内容被拖入时。图层面板未能更新父组件的图层以显示展开/折叠的插入点,阻止访问其嵌套元素。 根本原因 GrapesJS中的Layer视图负责渲染图层面板中的每个项目,会监听其关联组件模型上的change:open和change:components事件,以决定是否渲染展开/折叠的插入点。然而,在Backbone.js(GrapesJ...

#55932024年1月3日作者 thigh4 个回答
0 个反应

图层管理器在页面切换时无法刷新

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? MS Edge 120.0.2210.91 可复制演示链接 无 描述一下那个虫子 如何复现这个漏洞?更新至最新版本 grapesjs 建立一个多页项目注意当前层管理器的层级结构调用 pagemanager.select(pageId) 方法,针对当前选中的页面以外的其他页面图层管理器仍然反映上一页的层级结构,尽管页面管理器显示新页面当前为激活状态,画布正确渲染新选中的页面降级到 grapesjs v0.21.6,重复步骤3-5。每当选择不同页面时,图层管理器都会正确反映活跃页面的层级结构 预期的行为是什么? ...图层管理器应更新以反映活跃...

artf

谢谢你的反馈@thigh会解决的

sunnynk19

你好,@thigh,看起来还是没用。你部署了最新的 npm 包吗?

artf

尚未出版,你可以在这里找到所有 https://github.com/GrapesJS/grapesjs/releases

#55842023年12月27日作者 vian0132 个回答
0 个反应

当所有组件都挂载到画布中时,“存储:结束:加载”事件不会触发

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome v91 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞? 最近我必须将 grapesjs 0.14.62版本升级到最新版本(0.21.8)。在旧代码中,我们用“storage:end:load”来做一些操作,前提是所有组件都挂载到画布上。 但在当前版本中,它的工作方式已经不一样了。正如我在文档中看到的,“storage:end:load”现在会在存储加载请求完成后立即触发。有没有什么方法或其他事件能达到和之前相同的效果? 目前我只能在“storage:end:l...

artf

@vian013请只用可复现的演示链接打开bug问题,快速检查一下活动似乎正常运行

GJS Helper

从版本0.14.62到0.21.8,GrapesJS中storage:end:load事件行为的变化是有意为之,反映了更细致的事件系统。在新版本中,storage:end:load会在数据成功从存储管理器中检索时触发。这发生在组件解析、添加到编辑器模型树并随后渲染到画布之前,DOM.To 实现所有组件挂载到画布后才执行代码的预期行为,你应使用editor.on('load', ...)事件。### 根本原因与解释 storage:end:load事件的目的是表示存储加载过程...

#55832023年12月26日作者 ronaldohoch4 个回答
3 个反应

在移动端版本中,无法用样式面板设置背景:无

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Edge 最后版本 可复制演示链接 https://grapesjs.com/演示 描述一下那个虫子 如何复现这个漏洞?打开演示链接点击页眉 ![图片](https://github.com/GrapesJS/grapesjs/assets/2287371/c166B071-699d-4438-a3bf-0fb07607b45d)切换视图为手机或平板。尝试从头部移除背景。 预期的行为是什么? 那个编辑器把 background:none 的头部设置成了 目前的行为是什么? GrapesJS 继承自“桌面”版本,所以无法从移动端移除背景。 使...

artf

这不是bug,而是缺失的功能,我们需要用新的配置扩展栈类型,以实现“空”值。 我会尽量在下一个版本里加入。

artf

de 属性 Background 中的清除图标会完全移除所选设备的属性,使其再次继承桌面设置中的值。 正确图层行中的清除图标会重置栈值,将所选设备的属性设为默认值,移除背景,且不会继承桌面设置。在同一个清除图标中再次点击,该图层会完全移除。 我不确定这是否完全是我想的,但想法是让它按原样工作,但加入一个额外的逻辑,当我移除最后一层时,如果存在新的属性(例如“emptyValue”),我会应用。 这是一种可能的属性类型 “''js emptyValue?: string |(...

gustavohleal

我已经为栈类型插入了一个解。我打算做一个PR,但我想先问你一个问题。我添加的行为是: ![图片](https://github.com/GrapesJS/grapesjs/assets/22385451/31b5aa67-1de4-4430-a439-e41d6b1cbb21)图层行中的清除图标会重置堆栈值,将所选设备的属性设为默认值,移除背景,且不会继承桌面设置。在同一个清除图标中再次点击,该图层将完全移除。de 属性 背景中的 clear 图标会完全移除所选设备的属性,...

#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...

浏览所有主题