css - 我只能在 Sass 中使用嵌套

Question

我不确定我错过了什么，但我只能在我的 rails 文件中使用嵌套。我也希望能够使用mixins和变量。

我的 gem 文件是包含 sass：

group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'
  gem 'uglifier', '>= 1.0.3'
end

我的 css 文件是 name custom.css.scss。我错过了什么？

Answer 1

来自 Sass 文档：

要在 Rails 2 中安装 Sass，只需将 config.gem “sass” 添加到 config/environment.rb。在 Rails 3 中，将 gem "sass" 添加到您的 Gemfile 中。.sass 或 .scss 文件应放在 public/stylesheets/sass 中，在需要时它们会自动编译为 public/stylesheets 中的相应 CSS 文件（Sass 模板目录是可自定义的……有关详细信息，请参阅 Sass 参考）。

我必须将 css 文件放在 sass 文件夹中

Answer 2

I expect you're doing something like *= require_tree . in your application.css.scss file to include your stylesheets.

According to the official documentation, this won't work for mixins and variables:

If you want to use multiple Sass files, you should generally use the Sass @import rule instead of these Sprockets directives. Using Sprockets directives all Sass files exist within their own scope, making variables or mixins only available within the document they were defined in

It kinda sucks, but you need to include them all individually, if you want the mixins and variables to work. Including them using require compiles more quickly than using import, and should be preferred unless there are shared variables or necessary dependencies.

Example:

//= require navigation
//= require icons
//= require buttons
@import "variables.css.scss";
@import "mixins.css.scss";
@import "something_else.css.scss";