Zurb基金会-许多重复CSS条目 我用Zurb基金会已经有相当一段时间了。 我使用的是bower+指南针设置,如下所述

Zurb基金会-许多重复CSS条目 我用Zurb基金会已经有相当一段时间了。 我使用的是bower+指南针设置,如下所述 ,css,sass,zurb-foundation,compass-sass,Css,Sass,Zurb Foundation,Compass Sass,今天在工作时,我注意到一个页面需要一段时间才能加载,在尝试解决问题时,我注意到在生成的css文件中有许多重复的指令 我肯定这可能是我做错了什么,但我不知道从哪里开始寻找,我甚至不知道应该提供哪些信息来帮助缩小问题的范围 基金会5.4.5-->实际运行5.4.7 罗盘1.0.1 任何援助均已通知 ***************更新:***************** 事实证明,我当时正在运行5.4.7 我根据@Cartucho查找了_functions.scss 看起来补丁就在那里: // IM

今天在工作时,我注意到一个页面需要一段时间才能加载,在尝试解决问题时,我注意到在生成的css文件中有许多重复的指令

我肯定这可能是我做错了什么,但我不知道从哪里开始寻找,我甚至不知道应该提供哪些信息来帮助缩小问题的范围

基金会5.4.5-->实际运行5.4.7

罗盘1.0.1

任何援助均已通知

***************更新:*****************
事实证明,我当时正在运行5.4.7 我根据@Cartucho查找了_functions.scss

看起来补丁就在那里:

// IMPORT ONCE
// We use this to prevent styles from being loaded multiple times for compenents that rely on other components. 
$modules: () !default;
@mixin exports($name) {
  $module_index: index($modules, $name);
  @if (($module_index == null) or ($module_index == false)) {
    $modules: append($modules, $name);
    @content;
  }
}
@KatieK:输出css的一些示例 在第90行

/* line 386, ../../../../foundation_master/bower_components/foundation/scss/foundation/components/_global.scss */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
第2885行

/* line 386, ../../../../foundation_master/bower_components/foundation/scss/foundation/components/_global.scss */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
第3085行

/* line 386, ../../../../foundation_master/bower_components/foundation/scss/foundation/components/_global.scss */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

是基础5.4.5的错误。基本上,当Sass 3.4在处理全局变量时引入一些向后不兼容时,问题就开始了:

现在,所有不在文档顶层的变量分配都将被删除 默认情况下为本地。如果存在同名的全局变量,则 不会被覆盖,除非!使用全局标志。例如 $var:value!全局将全局分配给$var

但是这个新的语法没有被LIPSASS识别(基于SASS 3.2规范),所以基金会成员发布了5.4.5的部分补丁:

要解决此问题,请更新至5.4.6或更高版本。该错误出现在
\u functions.scss
的mixin
exports()
中。尝试用这个代码替换它(从基础5.4.6):

希望有帮助


编辑

似乎基础5.4.7仍然与SASS 3.4和SASS 3.2兼容,特别是指南针用户。在基金会论坛上有很多讨论。

根据,SASS 3.2的基础工作良好:

<> PASS直到所有SASS图书馆都能赶上SASS 3.4,基金会将 关于Sass 3.2。这意味着如果您已升级到Sass 3.4+和Compass 1.0+编译Compass项目的命令略有更改

我曾经用Compass编译SASS,但因为这些问题我放弃了。所以,我最后的建议是卸载Compass(通常是SASS 3.4)并使用libsass(基于SASS 3.2)。我使用以下脚本在我的Ubuntu中安装libsass:

#!/bin/sh

# install_libsass.sh
#
# Script for installing libsass (https://github.com/sass/libsass),
#
# NOTES
#   http://foundation.zurb.com/forum/posts/6803-trouble-creating-f5-project-with-grunt-and-libsass
#   http://mattferderer.com/compile-sass-with-sassc-and-libsass
#


sudo apt-get install git

cd /opt
sudo rm -R -f sassc
sudo rm -R -f libsass
sudo git clone https://github.com/hcatlin/sassc.git
sudo git clone https://github.com/hcatlin/libsass.git

cd /opt/libsass
sudo git submodule update --init --recursive

cd /opt/sassc
## Add the line "export SASS_LIBSASS_PATH=/opt/libsass"
## at the begining of sassc/Makefile
sudo sh -c "echo 'export SASS_LIBSASS_PATH=/opt/libsass' | cat - Makefile > temp && mv temp Makefile"
sudo make

echo "REBOOT!"
然后,使用以下命令重新启动并检查一切是否正常:

/opt/sassc/bin/sassc -h

多亏了@Cartucho,我通过查看更新的官方文件,指明了正确的方向。

以下是我为更新compass对编译基础的使用所做的工作:

1) 已安装的捆绑机

gem install bundler

2)在一个临时目录中启动了一个新的基金项目

foundation new throwaway_project
3) 已将该文件复制到现有项目的根目录中。看起来像

source "https://rubygems.org"

gem "sass", "~> 3.3.0"
gem "compass", "~> 1.0"
4) 跑了一次

bundle
5) 使用bundler再次运行指南针手表(如说明所示)


一堆弃用警告,但生成的css现在看起来不错。

可能是
扩展出了问题。尝试打开输出CSS中的行号。但是如果没有一个完整的例子,我们真的无法告诉您更多。您使用的是Compass版本还是Libsas?有很多关于基金会为BiassS安装Bover的讨论,因为它不能支持新版本的SASS。Compass安装可能也会发生同样的错误,但我没有这方面的经验。@KatieK一些输出css的例子above@austinthedeveloper我如何知道我使用的是哪个版本?我想我使用compass是因为我使用bower和compass来编译.Thx以供参考。我不可能自己找到这个。我更新了上面的细节。看起来我实际上运行的是5.4.7,补丁在代码中。你觉得这有什么不同吗?@w--我刚刚更新了我的答案。希望对你有帮助,祝你好运!啊。。没有看到compass说明的更新(这很糟糕,因为它们没有告诉您如何更新现有项目)。最终,我将运行新的指令。我将在另一个答案中公布我的具体步骤。谢谢你给我指明了正确的方向@很高兴能帮助你!的确,安装基础阅读文档确实令人困惑。
bundle
bundle exec compass watch