Rails - @import 和 *= 要求之间的区别？

Posted 2023-03-06

【中文标题】Rails - @import 和 *= 要求之间的区别？

【英文标题】：Rails - Difference between @import and *= require?

【发布时间】：2015-07-22 23:50:40

【问题描述】：

所以我有一个相对简单的 Rails 应用程序，我想通过 Bootstrap 为其添加一些材料设计样式。

我已将以下 gem 添加到我的 Gemfile：

gem 'bootstrap-sass'
gem 'bootstrap-material-design'

现在它们都可以工作，我的问题是为什么我似乎必须以不同的方式将它们添加到我的应用程序中。对于 vanilla Boostrap，我只需将其导入到特定于视图（我认为这是正确的术语）的 scss 文件中。

@import "bootstrap-sprockets";
@import "bootstrap";

但是对于 Material Design gem，我必须将它“要求”到根 application.css 文件中

 *= require bootstrap-material-design

为什么会有差异，这需要语法实际上在做什么？

【问题讨论】：

看看这个：***.com/questions/6074173/…

【参考方案1】：

include 和 require 方法做的事情非常不同。

require 方法完成了大多数其他编程中包含的操作 语言：运行另一个文件。它还跟踪您在 过去并且不需要两次相同的文件。运行另一个文件 如果没有这个附加功能，你可以使用 load 方法。

include 方法从另一个模块中获取所有方法，并且 将它们包含在当前模块中。这是语言级别的东西 与 require 的文件级事物相反。包含方法 是使用其他模块“扩展”类的主要方式（通常 称为混音）。例如，如果您的类定义了方法 “每个”，您可以包含 mixin 模块 Enumerable 并且它可以充当 一个集合。这可能会令人困惑，因为包含动词的使用非常 在其他语言中有所不同。

因此，如果您只想使用一个模块，而不是扩展它或进行混合，那么您将希望使用require。

奇怪的是，Ruby 的require 类似于C 的include，而Ruby 的include 几乎与C 的include 完全不同。

More info

【讨论】：

如何回答“@import 和 *= 要求之间的区别？”？

这个问题是关于 sprockets CSS 文件组织的，而这个答案是关于 ruby​​ 文件的。

【参考方案2】：

我猜你理解 CSS/SASS @import option 的用途。 require 是 sprockets directive。 Sprockets 在编译会话期间处理指令 - 所需文件的简单连接。唯一的区别是它们如何处理（共享）上下文。 简而言之 - 始终使用 @import 以确保安全。

请在此处查看详细说明： https://github.com/rails/sass-rails#important-note

【参考方案3】：

每当我更改 CSS 时，我都会遇到重新编译速度非常慢的问题。根据this article 的说法，Sprockets require 和 Sass @import 之间的差异是显着的，至少在性能方面：

资产管道对待 Sass @imports 的方式与对待 Sprocket 的方式不同。在导入的情况下，每次保存都会遍历并编译所有导入，无论您保存了哪个部分。在样式表中处理 Sprocket 的方式是，只有您保存的部分会重新编译，然后在您刷新时在本地注入到页面中。链轮是将多个部分加载到单个文件中以进行生产的默认方式。

通过对我的第三方供应商依赖项使用require，CSS 重新编译现在需要 1.5 秒而不是 25 秒。