PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验
已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 231 个问题
🔍 general我正在尝试用 nuxtjs 框架来完成 grapesjs，有什么解决方案吗？
artf
我觉得关键是为GrapesJS创建一个Vue组件，并在你的一些页面中使用它
GJSBlock
谢谢你举报，@pranay2210。 关于如何用 grapesjs 配合nuxtjs？提出了一个很好的问题。推荐的Canvas方法是使用事件驱动API。 从这里开始： 查看你所用模块的[GrapesJS 文档]（https://grapesjs.com/docs/） 寻找 on() 事件监听者方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： 如果你还卡住了： 分享最小的CodeSandbox复制品 把你已经尝试过的都写进去 提及你的 GrapesJS 版本 社...
我目前用 grapesjs 来构建邮件模板，但当我导入带有<style>标签的 HTML 时，在存储之前，HTML 和 CSS 会被拆分。当这些存储在后端数据库时，HTML 里没有 <style> or <link> 标签，而是单独存储。有没有办法防止这种情况，并存储两个版本的编译版本，或者至少能在发送到服务器之前注入样式？
Ju99ernaut
Grapesjs不支持内联，但你可以用这里用的同样方法 https://github.com/artf/grapesjs-preset-newsletter。它使用 'juice' 包来合并 html 和 css
artf
是的，目前内联CSS被解析为CssComposer，并且[已从DOM]（https://github.com/artf/grapesjs/blob/bb24e02c66c6bcb3104bf2c99fd3ef30a4d1e1f3/src/parser/model/ParserHtml.js#L290-L302 移除）。这允许编辑器编辑其样式。
ronaldohoch
关于它有一个问题。 ckeditor 如何用内联样式编辑跨度，关闭后保留并重新打开同一个模板？
亲爱的，你知道为什么样式管理器里没有选择默认属性吗？ 我可以触发什么事件来更新这个？？ ![图片]（https://user-images.githubusercontent.com/2309686/113360884-0ca0ca00-9321-11eb-9542-c38bc6c85a92.png）
artf
试着检查你的配置中的“styleManager”https://github.com/artf/grapesjs/blob/dev/src/style_manager/config/config.js（highlightChanged应该是“true”）
GJSBlock
谢谢你举报，@alemenciones。 关于在styleManager中未选中的默认属性，这是个很好的问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console...
我觉得让这个构建器变得出色的一点是加入顺风CSS类。尤其是现在有了新的Tailwind CSS按需生成器。
Ju99ernaut
我不确定这能不能加到核心库里，但如果有个插件肯定很棒。
artf
是的，我同意Brendon的看法，这绝对可以作为插件添加
GJSBlock
谢谢你举报，@silicahd。 感谢你分享关于FEAT： Tailwind CSS的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节，维护者可以更快地识别和优先排序修复...
版本：0.16.45 如果我添加 grapejs-preset-js，stylemanager 会重复每个选项两次。 这里有个 jsfiddle 链接，你可以检查相同的行为。 [https://jsfiddle.net/assadnazar/2asojqrc/1/]（https://jsfiddle.net/assadnazar/2asojqrc/1/） 也许是选项没有合并
Ju99ernaut
用途： “''js window.editor = grapesjs.init（{ // ... styleManager： { clearProperties：1 }, // ... }); ```
assadnazar
砰！
GJSBlock
谢谢你举报，@assadnazar。 感谢你分享关于StyleManager选项重复两次的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节，维护者可以更快地识别和优先排序...
我遇到的情况是，根据资产管理器的打开方式，我想传递一个略有不同的上传URL。 在asset：upload：start事件中，我让它查看应该使用哪个上传URL，如果需要更改，我会做 amConfig = editorAssetManager.getConfig（） amConfig.upload = 'NEW URL' 但它并没有用新的 URL 上传，而是坚持用 init 上定义的那个。Grapesjs 加载完成后，有没有办法更新配置？我没看到任何集合或 setConfig
SzaboGabesz
编辑。AssetManager.config.upload = 'NEW_URL' 就能做到
Ju99ernaut
配置里的值只在初始化时使用，所以改它没用，也许改一下这些会有帮助： “''js 编辑。Assets.FileUploader（）.config.upload = 'NEWURL'; 编辑。Assets.AssetsView（）.config.upload = 'NEWURL' ```
rcloss
谢谢，我刚试过这两个方法，但至少在asset：upload：start事件里没用
你好，我遇到了一个问题，就是当把视频或图片添加到画布时，画布不是居中，而是偏向左边。借助面板，我设定了对齐，但它也无法居中。 ![图片]（https://user-images.githubusercontent.com/67525225/113194408-7f357b00-9237-11eb-973b-fa7305418354.png）
Ju99ernaut
试着把它放进容器里，你可能可以用Flexbox之类的东西把它居中。
GJSBlock
谢谢你举报，@FacuCarbon。 感谢你分享关于图片和视频没有聚焦的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节，维护者可以更快地识别和优先排序修复。Grapes...
我有个问题，希望有人能帮忙。 我想做一个特性，让我在选择某个 div 的 div 时可以选择预定义的颜色。有人能帮我，如何简单地实现这个目标吗？
artf
你可以用一个简单的选择特性类型和颜色列表，并在颜色更改后更新它的样式。 这里有所有与你案件相关的例子：https://grapesjs.com/docs/modules/Traits.html
GJSBlock
谢谢你举报，@ikenderham。 关于问题：选择某个类或分元素时预定义的背景色，这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'some...
大家好，我正在通过 grapesjs 创建一个文档生成器，我想在每页底部插入类似“第1页共5页”这样的页码。我的起始模板有一个叫.page的封装类，实际上我可以把一个页面克隆到另一个页面下面，从而获得更多页面。 你知道我该如何实现这个功能吗？ 谢谢！
devtechk
大家好！我找到了实现目标的方法！CSS 的属性！ 这是我的工作代码（你可以随意调用分页标签）。 来源：https://www.pagedmedia.org/paged-js/ HTML： ' <页码类=“text-right 页码”>页 </pagination> ` CSS
GJSBlock
谢谢你举报，@devtechk。 关于生成页码，有什么建议吗？虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致跟踪 构建一个插...
@artf 你好，我不确定你是否理解我的问题。 我想在我自己的 js 编辑器里编辑 js 代码，首先我用 'getJs（'） 从你的编辑器里设置了 js 代码，但你demo.html里看起来是这样的： ![1444126130]（https://user-images.githubusercontent.com/23135336/112428513-3b91cb80-8d76-11eb-91de-ce51a8500203.jpg） 这些代码都是压缩的。我想要像这样一个未压缩的代码，格式为[https://github.com/Ju99ernaut/grapesjs-script-editor]（URL） ![1811563111]...
GJSBlock
谢谢你举报，@xinnai。 关于压缩的getJ's问题，这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed...