#53302023年8月24日作者 rozek3 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 没有 可复制演示链接 没有 描述一下那个虫子 yarn build 失败，有两个错误： 这可能只是TypeScript太挑剔的问题，因为你可以用 // @ts-ignore 禁用错误信息并重新编译测试会顺利运行。 但因为我刚接触 GrapesJS，不能自评。总之，通常不 // @ts-ignore TypeScript错误...... 行为准则 [X] 我同意遵守本项目的行为准则
GJS Helper
感谢你报告这个问题。你已经准确识别出在test/specs/utils/Sorter.ts文件中运行yarn build时，GrapesJS提交4f0c5b1中出现了TypeScript编译错误（TS2532: Object is possibly 'undefined'）。 根本原因 TS2532错误的出现是因为TypeScript严格的空检查（现代GrapesJS配置默认启用）检测到变量或对象在访问其属性时可能被undefined。即使测试的运行逻辑确保该对象在实际中从...
#53282023年8月22日作者 sdimitrenco2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://jsfiddle.net/sdimitrenco/wao1rh0q/30/ 描述一下那个虫子 那是我的组件结构 如果我在文本编辑器中更改span标签中的文本，然后移除焦点，它会返回文本之前的状态。组件的结构看起来正常，是链接，但内容在图片和文字标签内。 演示 ![图片]（https://github.com/GrapesJS/grapesjs/assets/39157717/1a21766a-d945-4d0b-9360-13390722c5dd） 现场演出 https://jsfiddle.net/sd...
GJS Helper
你遇到的问题是，嵌套span（text组件）中的可编辑文本在link组件中会因失去焦点而恢复到原来的状态，这是GrapesJS处理嵌套可编辑内容时已知的同步问题。 根本原因 当你使用富文本编辑器（RTE）编辑span内的文本时，GrapesJS会正确地直接更新DOM元素。当焦点失效（禁用RTE）时，text组件的模型会更新为新内容。这会触发text组件模型上的change:content事件。 问题在于，组件的link父节点是wrapper类型，在配置中已明确设置edita...
#53202023年8月18日作者 SwapnilSoni19994 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome v114 可复制演示链接 没有 描述一下那个虫子 如何复现这个漏洞？我用的是[grapesjs-react]（https://www.npmjs.com/package/grapesjs-react），并且用 assetManager我的配置长这样 附言：我确实有一个能用的终端，已经测试过了。现在进入浏览器中的编辑器添加图像从系统中选择图像则不发送上传请求 预期的行为是什么？ 预期是它应该触发请求并将资产上传到给定的网址 目前的行为是什么？ 它没有上传，而是把 base64 图片放到 DOM 里行为准则 [X] 我同意遵守本项...
artf
刚试了同样的配置，一切正常。 可能和你的Grapesjs版本或者“grapesjs-react”本身有关。 如果你无法用最新版本的GrapesJS提供可复现的演示，请避免制造BUG问题。 我也强烈建议切换到[官方的GrapesJS React包装器]（https://github.com/GrapesJS/react），它也允许你为编辑器实现完全声明式的自定义UI。
#53122023年8月17日作者 srinivas9772 个回答
GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome V115可复制演示链接 https://jsfiddle.net/srinivas977/ahgLxv6e/10/描述一下那个虫子 如何复现这个漏洞？ 在提供的 JSFiddle 中，包含一对文本行并选择列表。接着，添加一个子列表，然后添加子列表。之后，点击选定元素外，子列表中的一个项目会消失。 这个现象也在这个视频链接中看到（从视频第30秒开始注意）： https://github.com/GrapesJS/grapesjs/assets/49796104/59de9aa5-5f3f-43ae-9ed1-358b86ac8b27...
artf
不幸的是，由于默认实现依赖于 [deprecated execCommand]（https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand），导致太多边缘情况难以处理，已经不值得再花时间去处理了。 我建议只用它来处理基本格式（例如加粗、斜体、下划线等），对于更复杂的元素，我强烈建议创建[自定义组件]（https://grapesjs.com/docs/modules/Components.htm...
GJSBlock
谢谢你举报，@srinivas977。 关于列表富文本编辑器缩进操作的问题的好建议！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进...
#53052023年8月13日作者 rajevar2 个回答
GrapesJS 版本 0.21.4[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome 版本 113.0.5672.63可复制演示链接 https://jsfiddle.net/szLp8h4n/11/描述一下那个虫子 如何复现这个漏洞？ 在页面上移动任何文本组件。 警报将会显示。 可能是倒退。 https://github.com/GrapesJS/grapesjs/issues/868 没看到重新开启bug的选项，所以新建一个。 预期的行为是什么？ 警报只会在向画布添加新组件时显示 目前的行为是什么？ 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： 行为准则[X] 我同意遵守本项目的行为准则
artf
你好@rajevar我觉得你是在找“component：create”事件，因为“component：add”是正常工作的（比如用来跟踪某个组件内的任何新移动）
GJS Helper
你正确地指出了事件处理中常见GrapesJS混淆点。component:add事件确实不仅在新组件从块面板拖拽到画布上时触发，也在现有组件在画布上移动时触发。 根本原因解释 这种行为源于GrapesJS内部处理组件移动的方式。当你拖拽现有组件到画布的新位置时，GrapesJS执行一个内部操作，实际上包括： 将组件从其原始父/位置移除。 将组件添加到其新的父/位置。 因为组件内部被“添加”回DOM树（即使是同一个组件实例），component:add事件会被触发。这是一种简化...
#52882023年8月9日作者 pittleCheung2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 最新版本的Chrome浏览器 可复制演示链接 无效 描述一下那个虫子 如何复现这个漏洞？Tup-Node SRC/index.ts --format esm，cjs --legacy-output --watch 预期的行为是什么？ 我用Vite来建造 grapesjs 目前的行为是什么？<img width=“1126” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/114127651/26e08b79-17e9-42ca-9133-dae9a32313d4”><...
artf
我觉得你得向 Vite 社区反映这个问题，核心现在用的是 webpack，运行正常
GJS Helper
谢谢你举报，@pittleCheung。 关于use tsup-node build grapesjs appear Uncaught Error：不支持“codemirror/lib/codemirror”的动态要求，非常好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现...
#52862023年8月8日作者 saharhagekr2 个回答
在较小的笔记本屏幕（比如MacBook）上，图片的边框和某些元素的位置不对（当我点击移动或调整图片大小时） 当编辑器在大屏幕上渲染时，我就没有这个问题了。 我不确定是不是我漏掉了什么配置步骤。 有人能帮帮忙吗？这是常见问题吗？ 例如： <img width=“217” alt=“截图 2023-08-08 下午3点20分19分” src=“https://github.com/GrapesJS/grapesjs/assets/121887023/9b83c4a2-c944-4faf-94e0-3d6bca9c80d1”> <img width=“245” alt=“截图 2023-08-08 下午3：20 25” src=“htt...
artf
@saharelhage请避免将讨论转化为议题。GitHub 问题应仅通过正确遵循模板从[这里]（https://github.com/GrapesJS/grapesjs/issues/new/choose）创建。
GJS Helper
你遇到的选择和调整边框在较小屏幕上出现错误位置的问题，尤其是MacBook，是一个常见问题，通常与浏览器在不同缩放条件（浏览器缩放、操作系统显示比例）下渲染内容的方式或CSS冲突有关。GrapesJS依赖JavaScript通过选中组件的 getBoundingClientRect() 等方法计算选中和调整大小的handle位置和尺寸。如果浏览器的渲染上下文被缩放或变换，这些计算值可能无法准确反映屏幕上的视觉位置，导致对齐不一致。这种差异在较小的视口中更为明显，哪怕是轻微的...
#52692023年8月2日作者 sannila1 个回答
GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome 115.0可复制演示链接 https://jsfiddle.net/varyqjo7/描述一下那个虫子 如何复现这个漏洞？创建一个新的 Angular 项目（版本 16.1.3）安装 grapesjs 最新版本（npm i grapesjs）在angular.json（脚本和样式）中添加css和js添加面板 预期的行为是什么？ el 应该接受面板中的对象。 目前的行为是什么？ el 不接受面板的对象 请见下方附件： ![图片]（https://github.com/GrapesJS/grapesjs/assets/41979819...
GJS Helper
你遇到的问题是，“对象字面可能只指定已知属性，'el' 不存在于类型 'PanelProps'”，是 TypeScript 编译错误。它表明 el 属性在 PanelProps 接口中不是有效或识别的属性GrapesJS。 根本原因 el属性不包含在GrapesJS的PanelProps界面中。GrapesJS中的面板设计为由编辑器的UI系统内部管理和渲染。PanelProps界面定义了诸如id、content、buttons、visible、className和attri...
#52632023年7月28日作者 pittleCheung4 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 最新版本的Chrome浏览器 可复制演示链接 无效 描述一下那个虫子 如何复现这个漏洞？ <img width=“1666” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/114127651/c37e339a-e14f-486b-85fb-34c170b855dd”> 预期的行为是什么？ 目前的行为是什么？ 我用的是 rewrite ctrl + c 和 ctrl + v 的逻辑 <img width=“681” alt=“image” src=“https://g...
pittleCheung
是的，你说得对，我复制了所有匹配的样式，这样我可以粘贴到任何地方，甚至跨浏览器粘贴，我觉得这非常有用。当我删除组件时，对应的样式不会被移除。这是一个大问题，当我在同一个网站上多次复制粘贴时，会导致大量重复的样式，容易引发样式冲突。 所以我不能指望那些风格被简单删除。如果可能的话，我会很感激一些建议。 “如果你复制了所有匹配的样式，它还会包含其他元素使用的样式，所以你不能指望那些样式被简单删除。”
artf
我不明白这怎么会是核心漏洞。 你用的是自己的复制粘贴逻辑，感觉也不对，你应该注意每个组件/规则的唯一ID。删除这些子组件后，它们的样式依然保留。 如果你复制了所有匹配的样式，它还会包含其他元素使用的样式，所以不能指望那些样式被简单删除。 请，如果你提交了bug，务必提供可复现的演示。
#52492023年7月24日作者 pittleCheung3 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 最新版本的Chrome浏览器 可复制演示链接 无效 描述一下那个虫子 如何复现这个漏洞？ 编辑器？Css.addRules（targetCss）; 预期的行为是什么？ 编辑器？。Css.addRules（targetCss）;它在结尾添加样式 <img width=“826” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/114127651/28425b0a-b9f7-46a8-b8bc-736AA112cc3C”> 目前的行为是什么？ 我帮忙编辑吗？Css.add...
artf
这不是个bug，'Css.addRules'没有任何选项参数。 你可以就这个话题展开讨论，我们可以看看是否有必要引入它
pittleCheung
好的，我明白了，我需要在数组前面添加样式，而不是在最后。比如 arr.unshift（css）。我该怎么做？我可能需要你帮帮我
GJS Helper
你观察到的 editor.Css.addRules() 行为实际上是 GrapesJS CSS API预期且预期的功能。默认情况下，当你使用 editor.Css.addRules(targetCss);时，新的CSS规则会附加在由 GrapesJS管理的样式表末尾。这是许多CSS管理系统中常见的模式，新规则是顺序添加的。 不过， GrapesJS 提供了一个灵活的选项来控制CSS规则的插入点。你正确识别并使用了 at 选项，它允许你指定新规则在样式表中插入的准确索引。当你...