如何在 application.css 中要求特定文件答案

【问题标题】：How to require a specific file in application.css如何在 application.css 中要求特定文件
【发布时间】：2015-04-08 18:10:59
【问题描述】：

我试图在我的 Rails 4 应用程序的 application.css 中要求“font-awesome.scss”，如下所示：

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets,    vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require 'font-awesome.scss'
 *= require_tree .
 *= require_self
 */

'font-awesome.scss' 导入一堆看起来像部分的文件，前面有一个下划线。这些部分之一 (_variables.scss) 定义了一个变量，我在收到以下错误消息时需要定义该变量：

Sass::SyntaxError (Undefined variable: "$fa-css-prefix".
(in /Users/bla/rails_projects/Homepage/app/assets/stylesheets/_bordered-pulled.scss:4)):
app/assets/stylesheets/_bordered-pulled.scss:4
app/views/layouts/application.html.erb:35:in `_app_views_layouts_application_html_erb__3531690645719711557_70221015865520'

我做错了什么？

【问题讨论】：

你有没有试过在 tree 和 self 之后要求 font-awesome？ . Bootstrap 类似于基础，我的基础文件总是需要在 tree 和 self 之后才能正确导入到资产管道中。另外，如果需要，您会希望自己的 CSS 覆盖 font-awesome。

标签： css ruby-on-rails twitter-bootstrap

【解决方案1】：

这样做：

*= require font-awesome

无需加上引号或扩展名。更多关于此主题的文档：http://guides.rubyonrails.org/asset_pipeline.html

【讨论】：

谢谢尼克。但我已经试过了。 Rails 如何知道需要哪种字体？在文件夹中是 font-awesome.css。 font-awesome.min.css 和 font-awesome.scss
你在使用 font-awesome gem 吗？如果是这样，这应该可以解决问题。如果没有，请告诉我，我将删除此答案。
你不能要求一个scss文件你必须使用@import

【解决方案2】：

你可以在没有 gem 的情况下使用 font awesome，只需使用他们的 cdn。

这在你的布局中，application.html.erb

<head>
...
  <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
...
</head>

更多信息在这里：http://fortawesome.github.io/Font-Awesome/get-started/

【讨论】：

【解决方案3】：

尝试检查您是如何预编译资产的。检查initializers/assets.rb（或者它可能是你的environments/production.rb）以确保你以一种友好的方式预编译资产，像这样：

config.assets.precompile += ["*.js", "*.scss", "*.jpg", "*.png"]

我遇到了同样的错误

config.assets.precompile += [/.*\.png/,/.*\.ico/,/.*\.jpg/,/.*\.js/,/.*\.scss/]

【讨论】：