css - Sass mixin变量参数错误

标签 css sass mixins

<分区>

我在使用可变参数时遇到不一致的错误。

元素中有一些 mixin 接受可变参数。其中之一是;

@mixin box-shadow($shadows...) {
  -moz-box-shadow: $shadows;
  -webkit-box-shadow: $shadows;
  box-shadow: $shadows;
}

如您所见,它接受可变参数。 除了我工作场所的几台机器外,这在所有机器上都能正常工作。

在它不工作的机器上,我们得到以下错误;

Invalid CSS after "...x-shadow ($args": expected ")", was "...) {"

我们都运行相同版本的 SASS,Sass 3.3.7 (Maptastic Maple)

除 SASS 版本外,还有其他可能导致错误的原因吗? 在尝试解决此问题时,我们都使用完全相同的代码库。

最佳答案

应该是:

@mixin box-shadow($shadows) {
  -moz-box-shadow: $shadows;
  -webkit-box-shadow: $shadows;
  box-shadow: $shadows;
}

您的省略号似乎导致了问题。

此外,您可能需要考虑使用 SASS Mixin 库来为您完成许多这些常见的供应商前缀工作。我用波旁威士忌 - http://bourbon.io/

还有其他各种好处,比如将像素转换为 rems 的函数等。

更新

我刚刚意识到您正在尝试使用可变参数。在那种情况下,从文档来看语法看起来是正确的。确保您使用的是 SASS 3.2+

http://chriseppstein.github.io/blog/2012/08/23/sass-3-2-is-released/

我正在运行 SASS 3.3.6,使用您的代码时我没有收到此错误。

我建议在您的元素中使用 Gemfile 并从中构建。这将确保您确实使用了正确的 gem,并且每个人都使用相同的设置。

适用于您的代码的我的 Gemfile:

# Install these gems by running 'bundle install'.
# Install bundle from these instructions: http://bundler.io/

source 'https://rubygems.org'

# Using Compass Alpha release due to compatability with SASS 3.3+
gem 'sass', '3.3.6'
gem 'compass', '~> 1.0.0.alpha.19'
gem 'bourbon', '4.0.1'
gem 'neat', '1.6.0'

关于css - Sass mixin变量参数错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23626966/

相关文章:

java - @DeclareMixin 使用 Spring AOP?

html - 使用 LESS 为 IE8 提供 RGBa 浏览器支持的最优雅方式

html - 非按比例缩放 SVG 图像以适合剩余空间

html - Zurb基金会全身背景

css - 如何在 Meteor 中使用 LESS 或 Scss 的源代码映射?

css - 在没有评论的情况下禁用 SCSS Linting

ruby - ruby mixin 中奇怪的继承

javascript - 使用 d3.transition() 更改 CSS

html - 站点上的 css float 问题

jquery - 为什么即使屏幕具有相同的分辨率,CSS 媒体查询看起来也不同