问题 #1032💬 已回答提出于 2018年4月12日作者 tommedema2 个反应

多个字体-at-rule的CSS规则不会被处理

快速解答作者 tommedema1

@cjpollard谢谢,但看起来你拆解的东西是因为错误的缝合原因。 我认为更好的做法是一开始就不要把这些规则拼凑在一起。@artf我已经提交了永久居民申请: https://github.com/artf/grapesjs/pull/1036 说实话,我认为解析器不应该试图聪明地优化代码。浏览器本身就是一个解析器,如果浏览器里有规则,葡萄应该会遵守。通过让解析器变得复杂,我们引入了几个bug(我自己已经列出了一份清单)。事实上,我建议完全不用解析器,直接实时从 DOM / Javascript API 获取组件及其样式等。

阅读下方完整回答 ↓

问题

葡萄 #cfde1c1 最新版本 如果你提供一个单一的“@font面”,解析就很正常: JSFiddle 示例:https://jsfiddle.net/szLp8h4n/140/ 截图: <img width=“1395” alt=“截图 2018-04-11 下午3:19:56” src=“https://user-images.githubusercontent.com/331833/38646200-d5c4260e-3d9b-11e8-8c41-7c3c6b1f67dd.png”> 然而,如果你提供第二个“@font面”,只有第二个被解析,第一个则丢失: JSFiddle 示例:https://jsfiddle.net/szLp8h4n/141/ 截图: <img width=“1401” alt=“截图 2018-04-11 下午3点21分45分” src=“https://user-images.githubusercontent.com/331833/38646258-14959854-3d9c-11e8-977c-23a611fff2c5.png”> 我正在调试这个问题,但非常感谢你的帮助。这会不会和ParserCss.js中的[第122行](https://github.com/artf/grapesjs/blob/dev/src/parser/model/P...

回答(3)

tommedema2018年4月12日

@cjpollard谢谢,但看起来你拆解的东西是因为错误的缝合原因。

我认为更好的做法是一开始就不要把这些规则拼凑在一起。@artf我已经提交了永久居民申请:

https://github.com/artf/grapesjs/pull/1036

说实话,我认为解析器不应该试图聪明地优化代码。浏览器本身就是一个解析器,如果浏览器里有规则,葡萄应该会遵守。通过让解析器变得复杂,我们引入了几个bug(我自己已经列出了一份清单)。事实上,我建议完全不用解析器,直接实时从 DOM / Javascript API 获取组件及其样式等。

artf2018年4月13日

完全同意你,Tom,'cssComposer'的主要目标就是提供一个精简的样式定义界面。我们现在在 CssParser 里其实是一个[浏览器解析器](https://github.com/artf/grapesjs/blob/dev/src/parser/model/ParserCss.js#L192-L199),其余代码只是遍历器。实际上,我们遇到了像#307这样的问题,显示了浏览器解析器产生的不一致性(确实每个浏览器都会得到不同的输出)。 我的想法(已经添加到路线图 #74 中)是创建一个可扩展的界面,允许在编辑器中添加自定义解析器(例如CSS的“postcss”解析器),但显然还没找到...

tommedema2018年4月12日

@artf,顺便说一句,我现在可以在一个失败的测试案例中复现这个: 经过进一步调试,这似乎是因为“cssComposer”误以为第二条规则和前一条规则相同,然后返回了第一条规则: https://github.com/artf/grapesjs/blob/dev/src/css_composer/index.js#L185

相关问答

通过相似的问题讨论继续研究。

问题 #916

为什么图层没有元素标签名称?

我正在尝试葡萄内部结构,因为我希望将来能有所贡献。我主要关注的是用通用的HTML网站来做值得,无论CSS和HTML的风格和结构如何(包括文档类型、正文支持等)。 我原本以为“图层”层级会代表DOM树。虽然目前看起来没错,但元素的命名似乎不太对劲。例如,用这个 HTML 表示:...

3 个回答更新于 2019年12月17日

问题 #609

CSS 编辑会重复身体属性

它仍然在复制身体部位和属性: 当我打开它时,画面是这样的: <img width=“472” alt=“截图 2017-12-05 下午6:22 12” src=“https://user-images.githubusercontent.com/72599/33638098-...

3 个回答更新于 2019年9月18日

问题 #1014

让预览模式记住是否应该恢复可见性模式

目前,当你启用预览模式后再关闭时,即使可见性模式已经关闭,它也会自动开启可见性模式。这确实挺让人烦恼的。 我想创建一个PR来解决这个问题,但也需要你的建议,因为我不太明白你用Backbone时该怎么正确操作。 在“commands/view/Preview.js”中,你的“停止...

3 个回答更新于 2019年9月17日

问题 #1369

一个模块的类别不总是在类别部分显示

大家好, 我添加了许多自定义块,并为这些块中的所有图片赋予了相同的 css 类。暂且称之为“图像类”。当我拖拽其中两个方块,并在其中一个方块中选择一张图片时,“image-class”类一开始不会显示,点击右侧面板的类部分。只有当用户点击第二张图片时才会显示。 你可以在下面的图...

3 个回答更新于 2019年9月17日

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

相关教程

关于同一主题的深入指南。

全部教程 →

浏览插件分类

直接跳转到市场上的插件分类页面。