使用 @import 或 require 将 css 和 js 导入 Rails 4.2.4 应用程序答案

【问题标题】：Importing css and js into Rails 4.2.4 app using @import or require使用 @import 或 require 将 css 和 js 导入 Rails 4.2.4 应用程序
【发布时间】：2016-04-12 20:19:30
【问题描述】：

我需要将一些文件导入到 application.css 或 application.js 文件中。例如，对于 css，我使用 @import 语句。我在 vendor/assets/stylesheets 目录中有一些样式表：

vendor/assets/stylesheets/font-awesome.min.css
vendor/assets/stylesheets/bootstrap.min.css
etc

所以我使用：

@import 'font-awesome';
@import 'simple-line-icons';
@import 'bootstrap';

在这里我能够加载字体真棒文件，但不能加载引导程序或简单行图标。我收到了这个错误：

File to import not found or unreadable: file_name.css

很奇怪。从供应商目录导入文件的总体思路是否正确？还是应该将这些文件放在其他目录中？

P.S：我知道你可能会问我为什么要手动导入 bootstrap 而不是使用 gem；答案是我买了一些模板，我想包含模板中的所有文件以保持一致。

【问题讨论】：

您从vendor/assets/stylesheets 导入文件的想法是完全正确的。你试过用@import 'bootstrap.min'吗？
@AlexanderKomarov，谢谢，它有帮助。一般来说，问题是 font-awesome 是通过 gem 依赖加载的。
有道理，我想知道为什么你可以导入font-awesome 而不是bootstrap。 AFAIK 我应该将我的评论转换为实际答案。会的。

标签： ruby-on-rails ruby-on-rails-4 asset-pipeline

【解决方案1】：

您从vendor/assets/stylesheets 导入文件的想法是绝对正确的。从其他地方导入的文件（不是自己编写的）应该放在那里。

但是，您应该使用@import bootstrap.min，而不是@import bootstrap。

此外，正如@Rendrum 指出的那样，将*= require bootstrap.min 放入您的application.css 可能会更好。

【讨论】：

【解决方案2】：

外部实体拥有的资产应该放在vendor/assets目录下，这样才能被rails成功管理。

为了将它们包含在您的应用中，您可以通过在 application.css 中使用这些表达式来自动加载它们

*= require font-awesome
*= require simple-line-icons
*= require bootstrap

我建议您阅读本文以了解 Rails 的工作原理：http://guides.rubyonrails.org/asset_pipeline.html

感谢Alexander Komarov 的更正:)

【讨论】：

app/assets 用于您自己的资产。对于从其他地方获取的资产，您应该使用 vendor/assets 目录。
虽然不是app/vendor/assets，只是vendor/assets :)