PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验
已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 3,464 个问题
Hey, I know it got explained, how to use this but I didn't understand... How do I use this?
FreshImmuc
:/
GJSBlock
谢谢你举报，@FreshImmuc。 关于怎么做的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组件生命...
你好，感谢你帮我解答这个问题。我想用自己的JSEditor来编辑html、css和js。 1、首先，我用 'getHtml'， 'getCss'， 'getJs' 在我的 JSEditor 里显示代码。我发现JS代码是压缩的。我怎样才能获得无压缩代码？ 我用的是'编辑器'。CodeManager.getCode（model， 'js'）'，而且它也是压缩版的。我看了源代码，也不太明白为什么 CodeManager 能显示无压缩代码。 2、还有一点是：当我设置JS代码，比如“document.getElementById（”wrapper“）.style.background = ”red“'时，并做以下操作： 'const htm...
artf
组件用JS的“脚本”依赖于你源代码中的同样代码。比如，如果你创建了一个插件，然后用webpack/babel构建它，组件就会打印构建结果。我想你可以为你的“脚本”组件单独创建 js 文件，然后让捆绑器忽略那些文件。
xinnai
@artf 你好，我不确定你是否理解我的问题。 我想在我自己的 js 编辑器里编辑 js 代码，首先我用 'getJs（'） 从你的编辑器里设置了 js 代码，但你demo.html里看起来是这样的： ![1444126130]（https://user-images.githubusercontent.com/23135336/112428513-3b91cb80-8d76-11eb-91de-ce51a8500203.jpg） 这些代码都是压缩的。我想要像这样一个未压缩...
artf
“autoBeautify” 是传递给 CodeMirror 的一个选项，但无论如何，它可能会美化代码，但不会解压，因为代码本身就是这样存储在组件里的
我想用像 Element-UI 这样的 UI 框架自己构建样式管理器，快速做出一个美观的界面。但我该如何将属性绑定到选定的组件上？我没看到像“setProperties to an element...”这样的API。你能帮我讲讲怎么做吗，非常感谢!!
RutujaBadbe
#2296 这可能对你有帮助！
artf
我想如果你需要从零开始创建样式管理器，这种方法应该可行 “''js 让targetsToStyle = []; const eventToListen = 'component：toggled component：update：classes change：state change：device'; const sm = 编辑。风格经理; editor.on（eventToListen， （） => { targetsToStyle = editor.getSelected...
xinnai
@artf 这正是我需要的！非常感谢！
我正在努力让 grapejs Vue.js工作，但没有成功，我跟着入门程序操作，但还是没能正常工作。到目前为止，我已经把它添加到了 mounted() 部分，并且已经设置了一些带方块的按钮，可以显示并添加，但 [面板和按钮部分]（https://grapesjs.com/docs/getting-started.html#panels-buttons）一直没成功。 问题总结：使用Vue.js我无法让面板和按钮部分从开始时显示出来。 下面我附上了我目前主要想添加的App.vue文件——概念验证会稍后移到合适的位置。
uchoaaa
看看这个问题，可能会有帮助：https://github.com/artf/grapesjs/issues/275
artf
你好@joshk132说代码看起来不错，你能做一个可复现的演示吗（比如Codesandbox之类的软件）？
joshk132
@artf我已经让面板显示的位置正常工作了，但现在显示不正常了。我不得不做的解决方案是改用下面的代码。基本上我必须把“editor”作为变量，但我在最初的代码里已经去掉了，因为 vue linter 会抱怨。附上了一张图片链接，展示了下面代码的效果，我不太确定具体是什么原因导致了样式问题。 https://imgur.com/GuFqv0o
![图片]（https://user-images.githubusercontent.com/42827466/111476570-4b952400-8754-11eb-8d3c-1b8b9d29156c.png）
NagarRahul
@artf
artf
这种方法需要你组件中使用的 JS。所以，如果你没有带有 JS 的组件，它就会是空的
GJSBlock
谢谢你举报，@NagarRahul。 关于FEAT：我正在尝试用getJs（）方法获取js，但得到的是空值。我该如何获得 js？。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => con...
版本： 0.16.44 你能重现演示中的bug吗？[x] 是的[ ] 不 设置'编辑器'。Parser.getConfig（）.keepEmptyTextNodes = true;' 在控制台中，然后尝试将表单拖入一个两列插件。 预期的行为是什么？ 详细描述那个漏洞 据我观察，当定义了可丢弃属性时，“keepEmptyTextNodes”会抛出带有 Sorter.js 的错误。当它试图确定有效性时，最终会先获得文本节点，导致匹配比较失败（文本节点不支持匹配）。 目前的行为是什么？* 问题区域似乎是下面Sorter.js 这是因为tempModel拥有文本节点，可以包裹块中定义的内容。当移除它以获得 dropModel 时，我们得到...
artf
嗯，是的，这很合理，也许我们应该选第一个“有效”元素（也就是真正支持“匹配”的那个）。 但我也很好奇你关于使用“keepEmptyTextNodes”的理由是什么。几天前我其实还在考虑把它😂拆掉
neilkyoung
@artf 我们用于网页创作的系统实现了这一点。不过现在我们已经说服他们关闭了这个功能，感谢你上面的评论:-D
artf
太好了，那我就关上了。如果你那边的变更有问题或不同，请告诉我
嗨！ 我尝试过在Canvas和index.html中添加jQuery。 我正在这样用canvas添加它—— 'canvas = 编辑。画布; const script1 = document.createElement（'script'）; script1.src = 'https://code.jquery.com/jquery-3.6.0.min.js'; canvas.getDocument（）.head.appendChild（script1）;' 在HTML页面里我把它加成了script标签——'<script src=“https://code.jquery.com/jquery-3.6.0.min.js”></scr...
artf
这里你可以看到如何正确加载依赖 https://grapesjs.com/docs/modules/Components-js.html#template-related
GJSBlock
谢谢你举报，@RutujaBadbe。 错误 ReferenceError： $ 未定义 发生在 Canvas 尝试访问属性时，尚未完全初始化组件生命周期。这是GrapesJS中常见的竞争条件。 立即解决办法： 如果你控制代码，可以用空检查包裹调用： “JavaScript 如果（component && typeof component.getDocument === 'function'） { 你的准则 } ``` 根本原因分析： Canvas 在调用 'getDocu...
你好， Facebook社交媒体组件是用来提供指向企业或组织Facebook页面的链接，还是专门用来分享与你时间线相关的内容？看起来是后者，尽管我觉得这有点反直觉，因为很多邮件的页眉和页脚只是提供社交媒体账户的链接。我只是想确认一下它的设计方式，以及如果它确实按设计正常运行，有没有什么变通方法或计划改变这种行为。 此致， 里克
artf
我猜你就是在找这个 https://github.com/artf/grapesjs-mjml
HeyWrecker
啊，那是我的错，谢谢！
HeyWrecker
作为后续，我确认了Instagram社交部分确实链接到了Instagram的主页。而Facebook选项则不链接到Facebook页面。
你好，感谢你的工作。我有个问题。我想做一个类似Codepen的视图，并且想让Grapesjs视图可以上下拖动。但当我拖动它时，工具会去错位置，鼠标悬停高亮元素的位置也错了。我尝试过 splitjs 和其他开源代码，但总是遇到这个问题。 你能帮帮我吗？非常感谢!! https://user-images.githubusercontent.com/23135336/111138227-a5fa7d00-85ba-11eb-9393-0f3307322a56.mp4
Ju99ernaut
你可以试试运行 'editor.refresh（）'
xinnai
@Ju99ernaut 非常感谢，你救了我一命！
GJSBlock
谢谢你举报，@xinnai。 关于我把 gjs-cv-tools 放在分页时位置错误的问题很棒 grapesjs 。推荐的做法是使用事件驱动 API， GrapesJS 从这里开始： 查看你所处模块的[GrapesJS 文档]（https://grapesjs.com/docs/） 寻找 on() 事件监听者方法。 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： 如果你还卡住了： 分享最小的CodeSandbox复制品 把你已经尝试过的都写进去 提及你的 Grap...
我们正在开发一个使用 Grapes js 的 CMS 系统。我们设计了一个条件，不能在“mediaCondition”中添加宽高比，保持方向。我们的设计编辑器有16：9比例的竖屏和横屏设计模式。但我们希望增加更多宽高比，比如18：9、19：9和19.5：9，这样设计页面就能在不同的移动设备上放大。
artf
抱歉，你能更好地说明你需要什么吗？你对编辑器的最终CSS期望是什么？
no-response[bot]
由于我们请求原作者提供更多信息未获回应，本期已自动关闭。仅凭当前期刊中的信息，我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案，请随时联系我们，以便我们进一步调查。
GJSBlock
谢谢你举报，@Nigus。 关于问题：如何在设备管理器中为移动设备添加不同的宽高比，非常好。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...