Ruby on rails 避免呈现单独的布局';rails 4中的CSS文件(样式表冲突)

Ruby on rails 避免呈现单独的布局';rails 4中的CSS文件(样式表冲突),ruby-on-rails,layout,ruby-on-rails-4,Ruby On Rails,Layout,Ruby On Rails 4,我有一个“欢迎”控制器。我想为这个名为welcome.html.erb的控制器使用一个单独的布局,我只想使用welcome.css.scss-我已经完成了这项工作 现在我有了一个使用默认应用程序布局的“页面”控制器。但是,这个使用application.css.scss的应用程序布局也呈现我的其他布局的css(welcome.css.scss)。这导致我的所有页面操作看起来都一团糟,因为我的其他布局样式正在应用 welcome.html.erb(布局)css声明 <%= styleshe

我有一个“欢迎”控制器。我想为这个名为welcome.html.erb的控制器使用一个单独的布局,我只想使用welcome.css.scss-我已经完成了这项工作

现在我有了一个使用默认应用程序布局的“页面”控制器。但是,这个使用application.css.scss的应用程序布局也呈现我的其他布局的css(welcome.css.scss)。这导致我的所有页面操作看起来都一团糟,因为我的其他布局样式正在应用


welcome.html.erb(布局)css声明

<%= stylesheet_link_tag 'welcome', media: 'all', 'data-turbolinks' => true %>
true%>
My application.html.erb(布局)仍然是默认设置


总而言之,当我加载pages控制器时,我指定了我的页面布局,这反过来只使用welcome.css.scss-一切都很好。我点击一个链接,它将我带到页面控制器和BAM。。。它会加载我的所有css文件,并且welcome.css.scss与application.css.scss冲突

一些可能的解决办法:

  • 只需在welcome.html.erb body标记中添加一个id,将其所有样式包装到自己的小选择器中,并将其添加到application.css.scss(看起来很粗糙)
  • 是否可能更改application.css.scss顶部的小声明
我已经研究和试验了一段时间,我求助于S.O


谢谢你的帮助

您可能在注释中的
application.css.scss
顶部有一行,如下所示:

*= require_tree .

这需要样式表目录中的所有文件。您需要将其删除,并一个接一个地包含所需的内容。

布局

为了进一步了解joshia.paling的答案,也许你最好仔细研究一下——他们基本上允许你为应用程序的不同部分定义自定义HTML

在调用
布局的意义上,您需要在控制器中设置它(默认为
应用程序
):

--

清单

正如joshua.paling所提到的,您必须确保已从各种资产管道中排除了
welcome
资产:

如果要执行此操作,则需要将
welcome
资产添加到预编译设置中:

#config/environments/production.rb
config.assets.precompile += %w(welcome.css)

何时需要添加到预编译设置?当您使用rails命令生成控制器时,它似乎会为您创建新的css文件,但它们不会在预编译设置中声明。你明白我的意思吗?当然-当Rails预编译你的资产时,它会将你的文件编译成一个文件(通常是
application.js
/
application.css
)。使用precompile选项告诉Rails单独处理该特定文件(在
应用程序旁边创建它。**
在您看来,这是最好的方法吗?我想有一种方法可以保留“require_树”。但是避免呈现特定的样式表。我错了吗?我就是这样做的。可能有一种方法可以包含“除样式表xyz以外的所有样式表”,但我没有意识到。就个人而言,我更喜欢明确说明我所包含的内容,不喜欢说“只包含所有内容”或“包含所有内容,但…”
#app/views/layouts/welcome.html.erb
<%= stylesheet_link_tag 'welcome', media: 'all', 'data-turbolinks' => true %>
#app/assets/stylesheets/application.css
*= require x
*= require y
#config/environments/production.rb
config.assets.precompile += %w(welcome.css)