使用 Rails 时如何在清单文件中读取 Sprockets 指令?
How are Sprockets directives read in manifest file when using Rails?
Rails 的新手,请多多包涵...我今天在研究资产管道时查看了一个清单文件 (application.js),我很好奇 [=11] 等指令如何=] 正在阅读。这是 Sprockets 在后台做的事情吗?如何?为什么必须先注释掉该指令,然后添加等号?如果我取消注释指令并在我的浏览器中加载 application.js 文件,我将不再看到 jquery 库内容。只是好奇这是如何在后台工作的。
此外,当我添加自己的自定义 css 样式表时,我是在 application.css 清单文件中添加 require 指令,还是添加样式表 link,例如 <link rel="stylesheet" type="text/css" href="mystyle.css">
?还是我都做?我假设我不应该直接在清单文件中添加 css...
谢谢!
不知道你知道多少,所以会尽量详细解释。
Rails 将我们的资产(如图像、css、js 文件)存储在不同的位置,因此一切井井有条,更适合我们 - 开发人员使用。这就是所谓的Assed Pipeline。当 Rails 加载这些资产时,比如 css 文件,它会从我们所有的应用程序文件中创建一个大文件,以避免多次调用。清单就像 Rails 的地图或规则,哪些文件要包含在那个大 css 文件中,而这个 *=
告诉 Rails 究竟要包含什么(我认为它作为 Rails 语法)。所以当你有这样的事情时:
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
require_tree .
告诉 Rails 从 javascripts 文件夹中获取所有文件,而 //= require jquery
和其他人指示 Rails 特殊情况 - 资产,通常由您的宝石使用(那些您从未保存在 javascripts/stylesheets 文件夹中的文件,因此 //= require_tree .
看不到它们)。
当您添加 css 文件时,您只需将其添加到样式表文件夹中,然后 require_tree
通知 Rails 将其包含在大图片中。但是 Rails 有一个很好的功能——脚手架。您使用命令 rails g scaffold User
和 Rails 为您创建对象的脚手架 - 视图、控制器、模型、测试(谁知道还有什么 :))。所以在这种情况下,您甚至不需要创建 css 文件,只需将 css 规则插入其中,Rails 就会根据 require_tree .
找到它
sass 个文件有点不同:
If you want to use multiple Sass files, you should generally use the
Sass @import rule instead of these Sprockets directives. When using
Sprockets directives, Sass files exist within their own scope, making
variables or mixins only available within the document they were
defined in.
因此,如果您将使用 Bootstrap(可能会),了解这一点也很重要。
希望对您有所帮助
How? Why must the directive be commented out first
因为这是 sprockets 指令。它在该文件中的任何 js/coffee 有机会 运行 之前执行。 css 根本不是 "runnable" 代码。你如何使这种代码不产生任何错误?你评论一下。
... and the equal sign added?
将这些特殊指令与可能在该文件中的其他 "regular" 注释区分开来。
I'm assuming I shouldn't add css directly inside of the manifest file...
为什么不,继续。尽管出于代码组织的原因,您可能希望将任何自定义代码放在单独的文件中。但从技术上讲,这里没有问题。
Also, when I add my own custom css stylesheet, do I add a require directive in the application.css manifest file
不需要,require_tree .
会找到并包含您的文件。
or do I add the stylesheet link such as <link rel="stylesheet"type="text/css" href="mystyle.css">
?
不,不要那样做。
Rails 的新手,请多多包涵...我今天在研究资产管道时查看了一个清单文件 (application.js),我很好奇 [=11] 等指令如何=] 正在阅读。这是 Sprockets 在后台做的事情吗?如何?为什么必须先注释掉该指令,然后添加等号?如果我取消注释指令并在我的浏览器中加载 application.js 文件,我将不再看到 jquery 库内容。只是好奇这是如何在后台工作的。
此外,当我添加自己的自定义 css 样式表时,我是在 application.css 清单文件中添加 require 指令,还是添加样式表 link,例如 <link rel="stylesheet" type="text/css" href="mystyle.css">
?还是我都做?我假设我不应该直接在清单文件中添加 css...
谢谢!
不知道你知道多少,所以会尽量详细解释。
Rails 将我们的资产(如图像、css、js 文件)存储在不同的位置,因此一切井井有条,更适合我们 - 开发人员使用。这就是所谓的Assed Pipeline。当 Rails 加载这些资产时,比如 css 文件,它会从我们所有的应用程序文件中创建一个大文件,以避免多次调用。清单就像 Rails 的地图或规则,哪些文件要包含在那个大 css 文件中,而这个 *=
告诉 Rails 究竟要包含什么(我认为它作为 Rails 语法)。所以当你有这样的事情时:
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
require_tree .
告诉 Rails 从 javascripts 文件夹中获取所有文件,而 //= require jquery
和其他人指示 Rails 特殊情况 - 资产,通常由您的宝石使用(那些您从未保存在 javascripts/stylesheets 文件夹中的文件,因此 //= require_tree .
看不到它们)。
当您添加 css 文件时,您只需将其添加到样式表文件夹中,然后 require_tree
通知 Rails 将其包含在大图片中。但是 Rails 有一个很好的功能——脚手架。您使用命令 rails g scaffold User
和 Rails 为您创建对象的脚手架 - 视图、控制器、模型、测试(谁知道还有什么 :))。所以在这种情况下,您甚至不需要创建 css 文件,只需将 css 规则插入其中,Rails 就会根据 require_tree .
sass 个文件有点不同:
If you want to use multiple Sass files, you should generally use the Sass @import rule instead of these Sprockets directives. When using Sprockets directives, Sass files exist within their own scope, making variables or mixins only available within the document they were defined in.
因此,如果您将使用 Bootstrap(可能会),了解这一点也很重要。
希望对您有所帮助
How? Why must the directive be commented out first
因为这是 sprockets 指令。它在该文件中的任何 js/coffee 有机会 运行 之前执行。 css 根本不是 "runnable" 代码。你如何使这种代码不产生任何错误?你评论一下。
... and the equal sign added?
将这些特殊指令与可能在该文件中的其他 "regular" 注释区分开来。
I'm assuming I shouldn't add css directly inside of the manifest file...
为什么不,继续。尽管出于代码组织的原因,您可能希望将任何自定义代码放在单独的文件中。但从技术上讲,这里没有问题。
Also, when I add my own custom css stylesheet, do I add a require directive in the application.css manifest file
不需要,require_tree .
会找到并包含您的文件。
or do I add the stylesheet link such as
<link rel="stylesheet"type="text/css" href="mystyle.css">
?
不,不要那样做。