2011-08-18 53 views
5

假如你不使用框架,你应该如何管理在Rails应用程序中的大型ruby中组织css文件和包含?自然你会有你的应用程序级别样式(例如reset.css,applcation.css)。但在此之后,最好的方法是什么?我可以看到使用控制器特定的表格或更细化的视图特定的表格。还有其他明智的选择吗?什么是利弊?如何管理rails应用程序中的大型ruby中的css样式表文件和包含?

顺便说一下,我现在正在使用3.1之前的版本,似乎资产管道的包含可能会影响到答案 - 但很高兴听到来自资产管道前或后的管道解决方案透视。

谢谢!

+2

明智的做法,假设你没有使用框架,可能是重新考虑你的决定,并利用框架。撇开玩笑,大型项目从CSS框架中获得的好处是巨大的。代码重用,明确的(如果你做对了)关注点的分离,烘焙连接/压缩,列表继续。是的,sass + rails 3.1将会为你回答这个问题。 – numbers1311407

+0

@ numbers1311407感谢您的建议。我听到你说的是一个很好的经验法则,但是对于我在做的事情,我认为从一个框架开始就是矫枉过正的(第一遍样式很可能会在中期抛出无论如何)。我想它仍然来自您对sass/3.1的评论,最佳做法是什么。我认为你会推荐使用sass的嵌套功能进行组织,但是组织单元是控制器还是其他什么东西,文件结构是什么? – tks

回答

3

移动到答案,这是因为它(只是一个位)巨额的评论,尽管我知道这是不是你确切的答案”重新寻找。

我还没有转移到rails 3.1,但我一直在使用Compass/Sass很长一段时间,我可以宽松地描述我的(不断变化的)实践。

退房罗盘在这里: http://compass-style.org/

我的目标是要尽可能模块化,和我的风格分成类别几种不同的方式。示例结构可能如下所示。我嵌入评论与文件层次结构,所以希望它是可读的。

- stylesheets 
    # at top level, the files which are eventually concatenated and output, the main 
    # sheet, "screen", a stripped version for a wysywyg editor, and some overrides. 
    - screen.scss 
    - print.scss 
    - ie.scss 
    - wysiwg.scss 

    # also in this folder I tend to keep a reset 
    - _reset.scss 

    # and then separated, "includes" and "partials", includes being purely definitions 
    # and mixins, while partials being their application (actual CSS output) 
    - _includes.scss 
    - includes 
     - _definitions.scss # some global variable defs 
     - _typography.scss # typography mixins and defs 
     - _colors.scss  # colors mixins and defs, and so on 
     - ... 

    - _partials.scss 
    - partials 
     - _application.scss # top level layout + tweaks that don't belong anywhere else 
     - _typography.scss # the generation of typography CSS 
     - _colors.scss  # the generation of colors CSS, and so on 
     - ... 

     - _layouts.scss  
     - layouts    # layout specific styles 
     - _controllers.scss 
     - controllers   # controller specific styles 
     - _modules.scss  
     - modules    # modular, reusable pieces (widgets, breadcrumbs, navs, etc) 
     - _vendor.scss   
     - vendor    # everything vendor, (jquery-ui, qtip, colorbox) 

的基本理念是,一切都被编译成顶层* .scss文件,只有那些不是“谐音”用下划线前缀。这些文件非常简单,并且看起来像这样。共享文件夹名称

# screen.scss, import all partials 
@import 'reset'; 
@import 'partials'; 

# wysiwyg.scss doesn't need all the partials, but needs the basic stuff 
# and the semantic classes for wysiwyg users, e.g. ".red", etc. 
@import 'reset'; 
@import 'partials/typography'; 
@import 'partials/colors'; 
@import 'partials/semantic'; 

_layouts.scss和其他文件是简单的文件的集体进口其各自的目录。

总的想法是,部分保持尽可能薄,首当其冲的工作是在mixin中完成的。幸运的是,罗盘提供了一个完整的抓包,以及我大量使用的抓包。

对于某些这种类型的文件结构可能很笨拙,但我发现它适用于我的目的。特别是一旦你得到一个好的mixin库和可交换的partials库。它可以轻松调整一些变量定义或将一个部分或混合替换为另一个部分或混合,以便快速进行全局更改。

+0

感谢您的阐述 – tks

1

在我的项目中,我有一些助手可以根据控制器和操作加载样式表和JavaScript。我也加载默认,东西在一个共同的目录和供应商目录。这一切都在我的application.html.haml布局中完成,所有这些包括在标题中。

假设一个名为my_apps_controller.rb我的样式表和JavaScript的目录控制器看起来是这样的:

public/javascript/ 
    vendors/ 
    common/ 
    my_apps/ 
    common/ 
    index/ 
    edit/ 
    show/ 
    ...etc... 

我的样式表/上海社会科学院/目录看起来相似。

这里的好处是,我为我的资产建立了一个基于会议的组织,而不必玩配置游戏。我面临的挑战是,我发现不清楚它进入哪个行动目录的情况。到目前为止,虽然它为我服务。

我的助手基本上是:

module ApplicationHelper 
    def load_javascript_for_directory(directory_name) 
    glob_string = "#{directory_name}/**/*.js" 
    javascript_include_tag Dir.chdir(File.join(Rails.root, "public", "javascripts")) { Dir.glob(glob_string).sort } 
    end 

    def load_css_for_directory(directory_name) 
    glob_string = "#{directory_name}/**/*.css" 
    stylesheet_link_tag Dir.chdir(File.join(Rails.root, "public", "stylesheets")) { Dir.glob(glob_string).sort } 
    end 
end 

没有什么棘手的,但在我的应用程序布局我可以给他们打电话:

= load_javascript_for_directory "#{controller_name}/#{action_name}" 

这个加载了控制器/行动的具体资产和正常样板者获得我需要的东西。

我不想把这作为唯一的方法出售。这只是一种替代方案,不仅解决了我的问题,而且帮助我真正了解我的资产结构以及如何将它们干掉。

是的,上海社会科学院对我的样式表和CoffeeScript的我的JavaScript :)

相关问题