“未定义的 mixin 'box-sizing'”，在 rails 中，使用 compass-rails答案

【问题标题】："Undefined mixin 'box-sizing'", in rails, using compass-rails“未定义的 mixin 'box-sizing'”，在 rails 中，使用 compass-rails
【发布时间】：2014-03-24 17:25:20
【问题描述】：

这是错误信息：

Undefined mixin 'box-sizing'.
(in /var/www/site/spree/app/assets/stylesheets/store/neat/_neat.scss:3)

条件：

我正在使用 rails 4.0.2

我已经安装了 compass-rails gem，然后运行“bundle”。我还安装了宝石“bourbon”和“neat”。

在 'site/spree/app/assets/stylesheets/mystylesheet.css.scss' 中，我有这个：

@import "bourbon/bourbon";
@import "neat/neat";

neat 需要 compass 提供的 mixin “box-sizing”。但是，mixin 并没有被选中。

我试过添加@import "box-sizing", @import "compass/box-sizing"., @import "compass/css3/box-sizing"

这些行都不起作用：rails 仍然完全无法访问 compass mixins。

这是我的整个 gemfile：

source 'https://rubygems.org'
ruby '2.1.0'
gem 'rails', '4.0.2'
gem 'sass-rails', '~> 4.0.0'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.0.0'
gem 'jquery-rails', '~> 3.0.0'
gem 'turbolinks'
gem 'jbuilder', '~> 1.2'
gem 'mysql2'

group :development do
   gem 'better_errors'
   gem 'binding_of_caller', :platforms=>[:mri_21, :rbx]
   gem 'rails_layout'
end

group :development, :test do
   gem 'factory_girl_rails'
end


gem 'compass-rails'
gem 'bourbon'
gem 'neat'

gem 'spree', '2.1.4'
gem 'spree_gateway', :git => 'https://github.com/spree/spree_gateway.git', :branch => '2-1-stable'
gem 'spree_auth_devise', :git => 'https://github.com/spree/spree_auth_devise.git', :branch => '2-1-stable'

【问题讨论】：

你试过@import "compass/css3/box-sizing"; ?这对我有用
是的。试过了。错误保持不变。
你确定你使用的指南针版本有吗？也许你需要一个 alpha 版本，我通常会这样做。
是的。它记录在这里：compass-style.org/reference/compass/css3/box_sizing
你重启过 Rails 服务器了吗？

标签： ruby-on-rails gem sass

【解决方案1】：

你应该把你的 compass-sass 安装在 assets group

将 compass-rails gem 行添加到应用程序 Gemfile 中名为 :assets 的组（Rails 3.1+ 用户应该已经拥有 :assets 组）：

来源：https://github.com/Compass/compass-rails

@Fire-Dragon-DoL 所说的是检查 gem 是否具有支持 box-sizing 的正确版本的指南针

【讨论】：

Rails 4 不使用 :assets 组。我还在 SO 上找到了一个线程，其中 compass-rails 的维护者声明 gem 与 rails 4 兼容。

【解决方案2】：

Rails 4 确实删除了资产组（因此，如果您有该行，请将其删除）。我和你有同样的问题，在我的 gemfile 中更改我的 compass-rails 源为我解决了这个问题：

gem 'sass-rails'
gem 'compass-rails', github: 'Compass/compass-rails'

然后删除您的 Gemfile.lock 文件并使用 bundle 命令重新生成它。

rm Gemfile.lock
bundle

然后在我的 scss 文件中：

@import "compass";
@import "compass/reset";
@import "compass/css3/box-sizing";

【讨论】：

【解决方案3】：

您需要稍微修改一下语法，因为现在不推荐使用旧的调用 box-sizing 的方式。如果您以旧式 @include box-sizing(border-box) 调用它，请将其更改为 box-sizing: border-box;它对我有用。

【讨论】：