我正在使用Zurb Foundation 4(S)CSS框架,我遇到了大量重复样式的问题.这是因为在每个文件中,我@import’foundation’,基金会的所有样式也被导入(body,.row,.button和朋友的规则).这导致了长时间的SCSS编译时间,并且很难在Chrome中浏览Web开发者控制台,因为Zurb的所有样式都被宣布为四到五次.
为了缓解这个问题,我创建了一个全局scss文件,其中包含了基础使用的可重写变量(它是从foundation_and_overrides.scss复制粘贴,然后是foundation_and_overrides import全局变量).仅导入globals.scss文件才能在不使用Foundation mixins的文件中摆脱重复.
在使用Foundation mixins的文件中：只能从SCSS文件导入mixins,而不导入具体的Foundation样式？
解决方法
进口是一个全无或缺的事情.文件中的一切都是你得到的.如果您浏览基金会的来源,那么您可以修改这些变量来抑制发布样式(例如,在
buttons中,将$include-html-button-classes设置为false将禁用样式).这种设计模式是基础特定的,你不能指望其他库以这种方式创作.
当您通过@import“foundation”导入基础时,您正在导入此文件：https://github.com/zurb/foundation/blob/master/scss/foundation.scss.可以看到,它导入其他文件.如果您不需要任何内容,则不需要导入此文件：只需导入所需的特定文件(例如,只能导入side-nav文件的@import’foundation / components / side-nav’).
