css - 如何最好地在 Rails 应用程序中组织 Assets

标签 css ruby-on-rails ruby-on-rails-3 asset-pipeline organization

随着我在我的应用程序上不断取得进展,我的样式表文件夹很快就变得重载了。我已经阅读了关于 Assets 管道的 Rails 指南,并在互联网上搜索了一个有信誉的来源,但我仍然对保持一切整洁的“Rails Way”不知所措。

在我尝试自己开发一个系统之前,我希望能从你们那里得到一些建议。

在 Assets 组织方面是否有众所周知的“最佳实践”?如果不是,什么对您有效?

目前我的设置是这样的:

app/assets/stylesheets >

application.css, application-RESPONSIVE.css

任何特定于主体、容器、导航栏、页脚的代码

controller.scss, controller-RESPONSIVE

*任何特定于该 Controller 的代码

lib/assets/stylesheets >

reset.css

在我使用的 application.css 中

*= require reset
*= require_tree .
*= require_self

然而,要获得所有样式,我也一直在想,如果需要的话,在 tree 之前设置 self 是否可以更好地覆盖主要样式是吗?

最佳答案

Is there a well known "best practice" when it comes to asset organization?

Assets 组织:

在 Rails 中,管道 Assets 可以放置在应用程序内部的三个位置之一:app/assets、lib/assets 或 vendor/ Assets 。

1) app/assets 是应用程序拥有的 Assets ,例如自定义图像、JavaScript 文件或样式表。

2) lib/assets 用于您自己的库的代码,这些代码并不真正适合应用程序的范围或那些跨应用程序共享的库。

3) vendor/assets 用于外部实体拥有的 Assets ,例如 JavaScript 插件和 CSS 框架的代码。

Is it better to set self before tree as a means of overriding the main styles if need be?

application.css 就是所谓的 list 文件。现在,用 tree 切换 self 不会有什么特别的区别,但它会改变它在加载顺序中的位置。考虑一下……

将资源放置在它们的逻辑位置后,您可以使用 list 文件告诉 Rails(通过 Sprockets gem)如何将它们组合成单个文件。这些 list 文件包含指令 - 告诉 Sprockets 需要哪些文件才能构建单个 CSS 或 JavaScript 文件的指令。

附加信息:

Rails 做的另一件事是当您在终端中运行 rails generate 命令时为您生成样式表。创建新 Controller 时,您会在 Assets 中看到带有 Controller 名称的样式表。它看起来像 app/assets/stylesheets/newcontroller.css.scss

另外,steve klein 说的。

希望这对你有帮助。

更新:

I've tried looking for examples on github but all of the apps I have found have been too simple and havent shown any advanced organization for a large amount of files.

我鼓励您查看 Open Source Rails网站。我看过那里的一些元素,它们看起来足够复杂,足以让你感兴趣。特别是,看看 Discourse app . Discourse 由 Stack Overflow 的联合创始人 Jeff Atwood 共同创立。我想这不言而喻 ;)

关于css - 如何最好地在 Rails 应用程序中组织 Assets ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31444115/

相关文章:

ruby-on-rails - 检查子类中是否存在方法

ruby-on-rails - 无法使用带有 Rails 的 axlsx 卡住标题 Pane

ruby-on-rails - 载波图像扩展

ruby-on-rails - Rails - 使用 PostgreSQL 安装 Cucumber

html - 文本区域背景与其在 IE 上的占位符背景图像冲突

html - 所有页面上的CSS @page background-images?

ruby-on-rails - Rails gem update not working (version 4.1.1 to 4.2.0) 作为 "warning: circular argument reference"错误的解决方案

ruby-on-rails - 如何更改正常的验证行为,以便将消息添加到自定义错误键?

javascript - 覆盖这个类的字体大小 .MuiTypography-body1

html - CSS 导入不起作用?