如何在我的 Rails 4 应用程序中配置 Compass 和 Zurb Foundation 5，以便它们都可以在同一个目录中访问？

Posted 2023-03-04

【中文标题】如何在我的 Rails 4 应用程序中配置 Compass 和 Zurb Foundation 5，以便它们都可以在同一个目录中访问？

【英文标题】：How can I configure Compass and Zurb Foundation 5 in my Rails 4 app so that they are both accessible in the same directory?

【发布时间】：2014-05-14 04:52:09

【问题描述】：

我有一个 Rails 4 应用程序，我在其中使用 Compass 和 Zurb Foundation 5。我想将 Compass 和 Foundation 5 与 Rails 4 应用程序一起使用。

更具体地说，我希望能够在 stylesheet.scss 文件中执行此操作：

@import "compass";
@import "foundation_and_overrides";
[additional imports] 

换句话说，我希望能够将我所有的 sass 文件放在同一个目录中。但是，目前，Foundation scss 文件位于“app/assets/stylesheets”中，因为似乎 Foundation 文件“foundation_and_overrides.scss”需要位于此目录中。同时，我将所有其他 sass 文件都放在“/sass”目录中，然后将其编译为“app/assets/stylesheets”

如何配置 Compass 和/或 Foundation，以便它们都可以从同一个目录访问？

这似乎只是一个知道用于我的导入的正确路径的问题。

根据this *** post，我尝试了以下操作：

@import 'foundation/foundation-global';
@import 'foundation/components/type';

但是，然后我收到以下指南针错误：

    error sass/stylesheet.scss (Line 2: File to import not found or unreadable: foundation/foundation.
    Load paths:
      /Users/Anders/Dropbox/WWW/sbox-project/research/foundation-test/sass
      /Users/Anders/.rvm/gems/ruby-2.0.0-p247/gems/compass-0.12.4/frameworks/blueprint/stylesheets
      /Users/Anders/.rvm/gems/ruby-2.0.0-p247/gems/compass-0.12.4/frameworks/compass/stylesheets
      Compass::SpriteImporter)

正在使用的 Gem 版本：

指南针 (0.12.4) 指南针导轨 (1.1.7) 基础导轨 (5.2.1.0)

指南针配置文件（compass.rb）

    project_type = :rails
    http_path = "/"
    css_dir = "app/assets/stylesheets"
    sass_dir = "sass"
    images_dir = "app/assets/images"
    javascripts_dir = "app/assets/javascripts"

任何建议将不胜感激！另外，请让我知道我应该提供哪些其他信息来提供建议。谢谢！

【问题讨论】：

您是否在安装包后运行了“rails g Foundation:install”？

是的，按照这些说明操作foundation.zurb.com/docs/applications.html

【参考方案1】：

在 compass.rb 中

sass_dir = 'app/assets/stylesheets'

最好将编译好的css文件放在'public'文件夹中。

css_dir = 'public/stylesheets'
images_dir = 'public/images'
javascripts_dir = 'public/javascripts'
fonts_dir = 'public/fonts'

然后初始化指南针：

compass init

或者如果使用捆绑器：

bundle exec compass init

您的 config/compass.rb 更改将应用​​于 config.rb