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

GrapesJS 问题

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

找到 545 个问题

🔍 typescript
#52452023年7月16日作者 riteshdalal4 个回答
0 个反应
提问组件缺陷画布typescript

带有 editable：false 的组件内容仍然是可编辑的

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 114.0.5735.198 可复制演示链接 https://jsfiddle.net/riteshdalal/obnx7sg3/22/ 描述一下那个虫子 如何复现这个漏洞？在模型中创建一个带有 editable：false 的组件将组件放置在画布上 预期的行为是什么？ 不可编辑组件的内容不应被GJS解析 目前的行为是什么？ 不可编辑组件的内容会被解析并可编辑 请查看附带的演示链接行为准则 [X] 我同意遵守本项目的行为准则

artf

“可编辑”属性默认没有意义，只有其他扩展组件如“文本”或“图像”在内部使用。

riteshdalal

@artf我们如何创建一个组件，使 GJS 不解析这些子节点。

riteshdalal

“可编辑”属性默认没有含义，只被其他扩展组件如“文本”或“图像”内部使用。 这在旧版GJS上是有效的。0.21.3 版本就完全不工作了

查看详情
#52362023年7月11日作者 joukhar2 个回答
0 个反应
组件缺陷提问typescript

内容为“null”的TextNode被渲染为“null”，而不是空白

GrapesJS版本[X] 我确认使用最新版本GrapesJS你用的是什么浏览器？ Chrome 版本 114.0.5735.199（官方构建）（64位）可复制演示链接 无描述一下那个虫子 抱歉又提起这个问题了，但你的提交功能不起作用 我用npm install GrapesJS/grapesjs#dev安装了开发版 问题依然存在。 请您检查以下内容： /grapesjs/src/domcomponents/view/ComponentTextNodeView.ts grapesjs/src/domcomponents/view/ComponentCommentView.ts 在你修好之前，我会用editor.getHtml()来...

artf

@joukhar“npm install GrapesJS/grapesjs#dev”是不够的，我还没在开发分支里创建构建，所以如果你想本地解决这个问题，必须先自己构建。 无论如何，即使相关问题关闭了，也没必要新建，你仍然可以在那里添加更新，问题没有被锁定。

GJS Helper

感谢您报告此问题并详细说明相关代码部分。您已正确识别问题根源。 根本原因分析： 问题源于JavaScript的textContent属性和document.createComment方法如何处理null或undefined值。当执行el.textContent = null;或document.createComment(null);时，JavaScript隐式地将null转换为字符串的字面值"null"。这是标准的DOM行为，但当 model.content 表示空或不存...

查看详情
#52322023年7月11日作者 bgrand-ch4 个回答
5 个反应
提问组件缺陷style-managertypescript

工作者 - 无头“文档未定义”

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 114.0.5735.133 可复制演示链接 不可能添加工蚁来繁殖。 描述一下那个虫子 如何复现这个漏洞？添加一名网页工作人员。在工作者内部设置“无头”选项初始化 GrapesJS 。添加一个带有“editor.DomComponents.addType” + “styles”的插件。给员工发消息。参考文献错误：文档未定义。 预期的行为是什么？ 在工作者中使用 GrapesJS ，避免出现“ReferenceError： document is not fined”错误。 目前的行为是什么？ 参考错误：文档未定义。 如果需要执行某些代码以重...

artf

你好，@bgrand-ch，不幸的是，所有涉及解析器（HTML/CSS）的内容都需要使用与DOM相关的API。对于CSS，也许你可以试试用[parser-postcss插件]（https://github.com/GrapesJS/parser-postcss），我预计它能在工作环境下工作

bgrand-ch

你好，@artf，非常感谢你的快速回复😄，我这周会试试看。

bgrand-ch

@artf Post CSS 解析器插件在 Web Worker 中运行得非常完美！谢谢你的帮助。

查看详情
#52212023年7月7日作者 Staubgeborener2 个回答
0 个反应
提问缺陷文档style-managertypescript

移动设备上的桌面版本

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Safari 16.5可复制演示链接 https://grapesjs.com/demo.html https://staubgeborener.de/描述一下那个虫子 我试用了官方的[演示]（https://grapesjs.com/demo.html）。我什么都没改，只是点击 view code 按钮，下载html和css文件作为压缩压缩包。这些文件已经上传到我的网页服务器上，桌面设备运行得很正常。但当我用移动设备访问这个网页服务器（比如iOS-Safari浏览器）时，网站仍然是桌面版，而不是移动端版本。演示本身已经实现了移动版。 如何复现...

artf

这与核心无关，只是导出 HTML 中缺少一个元标签demo.html '''html <meta name=“viewport” 内容=“width=device-width，initial-scale=1”> ``` 如果你想提交永久居民申请，我很乐意帮你合并

GJS Helper

你遇到的问题不是GrapesJS本身的bug，而是部署响应式网页时常见的疏忽。根本原因是导出的HTML文件<head>部分缺少viewport meta标签。 根本原因解释 现代移动浏览器依赖viewport元标签来正确响应式地渲染网页。没有该标签，许多移动浏览器（尤其是iOS上的Safari）默认将页面渲染为类似桌面的宽度（例如980px），然后缩放以适应设备屏幕。这导致移动设备上会出现“桌面版本”，即使你的CSS包含针对较小屏幕的媒体查询。 GrapesJS演示页面（h...

查看详情
#52112023年7月2日作者 Zafermushtaha973 个回答
1 个反应
组件缺陷提问typescript

Bug

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ v9.2 可复制演示链接 https://jsfiddle.net/szLp8h4n 描述一下那个虫子 我在 Vue3 项目中使用它 当我想添加新组件时，页面会挂机且没有响应 这是我的代码： 行为准则 [X] 我同意遵守本项目的行为准则

gxanshu

你好！😊 我不认为这是GrapesJS的bug。我查看了你的复制链接，尝试在画布中添加组件，完全没问题。👍

artf

你必须绕过Vue的代理观察者 https://github.com/GrapesJS/grapesjs/issues/4497#issuecomment-1213078160

GJS Helper

你遇到的问题是，当程序性添加新组件时页面卡顿，源于组件创建和附加方式不当， GrapesJS。你本质上是在添加一个已经作为另一个组件子节点附加到编辑器根包装器的组件，导致无效状态并导致编辑器卡死。 根本原因 让我们拆解一下你的原始代码： this.editoren.DomComponents.getWrapper().append(...)：该行根据提供的定义（{ type: 'text', content: 'New text component' }）创建一个新组件，并...

查看详情
#51752023年6月10日作者 krishnaeverestengineering4 个回答
0 个反应
组件缺陷提问文档typescript

移动方法没有按预期工作

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://codesandbox.io/s/adoring-margulis-873kdv 描述一下那个虫子 背景 移动组件的方法没有按预期工作。 这段代码没有按预期工作。 这段代码应该可以正常工作。当 sameParent 是 false 且目标索引是 1 时，比如它不会移动到 0 对 1 的位置行为准则 [X] 我同意遵守本项目的行为准则

krishnaeverestengineering

解决方法：https://github.com/GrapesJS/grapesjs/pull/5176

artf

谢谢@krishnaeverestengineering，但这实际上是将组件移入同父节点时的预期行为。这是因为“at”还应考虑组件本身的索引。 所以，如果你尝试将“组件1”移到索引0或1，什么都不会发生。如果你需要把它移到“组件2”以下，你必须标注索引2

krishnaeverestengineering

谢谢@krishnaeverestengineering，但这实际上是将组件移入同一父节点时的预期行为。这是因为“at”还应考虑组件本身的索引。 所以，如果你尝试将“组件1”移到索引0或1，什么都不会发生。如果你需要把它移到“组件2”以下，你必须标注索引2 但我不太理解它的使用场景。通常在最后版本中，'at '应该算是索引。那怎么把组件从0移到索引1呢？

查看详情
#51742023年6月9日作者 tomsleeter3 个回答
0 个反应
缺陷提问typescript

GrapeJS.com 首页被黑/链锁重定向恶意软件

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome 114.0.5735.110（官方版本）（64位）可复制演示链接 https://grapejs.com *编辑：本网站/域名提供恶意软件，实际 grapesjs.com 域名中缺少“s”。描述一下那个虫子 grapejs.com 访问主页后，浏览器会被引导进入一连串重定向，最终进入一个恶意软件S3登陆页，画面会爆发出全屏+音频+弹窗垃圾信息，要求付款。 后续复刻时复刻/隐身使用铬版。相当确定问题不在我这边行为准则[X] 我同意遵守本项目的行为准则

tomsleeter

这只是间歇性，现在我终于能正常看到 grapejs.com 首页了

tomsleeter

好吧，这是我的错误，我输入错了网址/域名——漏掉了 grapesjs.com 里的“s”。 访问URL grapejs.com 是一个带有大量恶意软件/弹窗的假地址 我相信错误的域名会重定向到每隔一页加载一次 grapesjs.com，这让情况更复杂。 结束了，主网站没有问题。

GJS Helper

看起来你遇到了一个恶意网站，利用 GrapesJS 域名中常见的拼写错误。感谢你报告这一关键观察。 根本原因与解释： 你描述的问题既不是 GrapesJS 框架本身的漏洞，也不是官方 GrapesJS 网站的问题。问题出在域名 grapejs.com （缺少“s”），这是一个恶意的拼写抢注域名。 官方 GrapesJS 网站： GrapesJS 的合法且安全的网站是 https://grapesjs.com。 恶意域名： 域名 https://grapejs.com （不含...

查看详情
#51672023年6月6日作者 KevenDvorianoff2 个回答
0 个反应
缺陷typescript提问文档

UsePlugin 不是一个函数

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ 全部可复制演示链接 没有描述一下那个虫子 按照使用TypeScript创建插件的文档，并使用“usePlugin”功能将插件导入编辑器，浏览器显示以下错误： 看起来函数声明不在节点模块的压缩 js 中。行为准则[x] 我同意遵守本项目的行为准则

sneddobuilds

我也遇到同样的问题。

GJS Helper

GrapesJS 中的 TypeError: g.usePlugin is not a function 错误通常源于对插件注册和加载方式的误解，特别是将全局 grapesjs 库对象与 editor 实例混淆。 根本原因 TheThe usePlugin 方法是主 grapesjs 库对象的静态方法，不是editor对象的实例方法。它的目的是以特定 ID 全局注册一个插件，并以特定 ID 与 GrapesJS 库进行，以便以后可用。你错误中的gg.usePlugin is...

查看详情
#51642023年6月6日作者 shomeel2 个回答
0 个反应
提问组件缺陷画布typescript

默认情况下，组件是用我的演示项目中的表格创建的，但演示用flex属性来创建组件

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 版本 112.0.5615.49（官方构建）（x86_64） 可复制演示链接 https://jsfiddle.net/shomeelconovo/k7L2rthg/1/ 描述一下那个虫子 我需要一些关于 grapes.js的帮助。我创建了一个项目，每当我在Canvas中放置一个组件时，默认每个组件都有display ： table属性。不过我在 grapes.js 官方演示中尝试过，每个元素在演示中默认都有display ： flex。可能出了什么问题？为什么本地项目默认有不同的属性？ 行为准则 [X] 我同意遵守本项目的行为准则

artf

https://github.com/GrapesJS/grapesjs/discussions/5163#discussioncomment-6162516

GJS Helper

你GrapesJS项目和官方演示默认display属性的差异，源于GrapesJS画布iframe中加载的CSS，而不是因为GrapesJS本身普遍强制执行display: table或display: flex。GrapesJS提供了一个干净的起点，最终渲染取决于你（或演示）注入到编辑器画布中的基础CSS。 根本原因 您的本地项目： 您的本地项目很可能包含一个全局 CSS 文件或 CSS 框架，默认display: table某些通用元素（如 div 或 section）...

查看详情
#51592023年6月1日作者 CaptSadaf3 个回答
0 个反应
提问keyboard缺陷typescript

启用CKEditor后，无法在文本栏下拉选项中添加占位符

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ 铬可复制演示链接 https://codepen.io/darrenbawag/pen/JjWBLrp描述一下那个虫子 如何复现这个漏洞？打开这个链接 https://codepen.io/darrenbawag/pen/JjWBLrp，尝试用这段代码显示CKEditor工具栏的占位下拉菜单，但只有当我们没有在配置中添加 grape grapesjs-plugin-ckeditor时，下拉菜单才会显示。... 预期的行为是什么？ GrapeJS CKeditor 应该提供添加自定义占位符下拉菜单的功能， 目前的行为是什么？ 当我使用 grape...

CaptSadaf

CC：@jcamejo @artf

artf

这些动作只在内置RTE上使用，如果你用自定义RTE比如CKEditor替代，就看不到它们。你必须用 CKEditor 来实现自定义逻辑。

GJS Helper

你遇到的问题源于GrapesJS默认的富文本编辑器（RTE）和CKEditor工具栏自定义方式的根本差异。当你启用grapesjs-plugin-ckeditor时，GrapesJS会用功能齐全的CKEditor取代其轻量级的内置RTE。因此，设计用来扩展默认GrapesJSRTE工具栏的rte.add()方法不再适用于CKEditor。 根本原因： 你用rte.add()的代码片段试图修改GrapesJS内部RTE。不过，当grapesjs-plugin-ckeditor...

查看详情

浏览所有主题