@import在子文件夹中的SASS文件中不起作用

lux*_*ama 6 gem sass ruby-on-rails-3

设置阶段

我有以下样式表结构:

/stylesheets   
 |
 |-- /subfolder
 |    |
 |    + styles.css.scss
 |
 + application.css.scss 
Run Code Online (Sandbox Code Playgroud)

application.html.haml

  = stylesheet_link_tag "application", media: "all"
  = stylesheet_link_tag "subfolder/styles", media: "all"
Run Code Online (Sandbox Code Playgroud)

application.css.scss

@import "styleguide";
@import "styleguide/base/_all";
@import "styleguide/modules/_all-no-grid";
// Omitting rules not relevant to the problem
Run Code Online (Sandbox Code Playgroud)

styles.css.scss

@import "styleguide";
@import "styleguide/grid/_grid";
@import "styleguide/modules/_all-grid";
// Omitting rules not relevant to the problem
Run Code Online (Sandbox Code Playgroud)

styleguide文件存在于gem中vendor/stylesheets,在RoR引擎的帮助下为资产提供服务.

问题

当我使用预编译资产在生产中运行我的应用程序时,我遇到了指向@import样式指南的问题.

File to import not found or unreadable: styleguide.
Load path: 
 Sass::Rails::Importer([omitted]/app/assets/stylesheets/local/styles.css.scss)
 (in [omitted]/app/assets/stylesheets/local/styles.css.scss)
Run Code Online (Sandbox Code Playgroud)

解决方法

styleguide本身没有问题,因为只要我subfolder/styles.css.sccsapplication.css.scss文件导入文件,一切都按预期工作.

application.html.haml

  = stylesheet_link_tag "application", media: "all"
Run Code Online (Sandbox Code Playgroud)

application.css.scss

@import "styleguide";
@import "styleguide/base/_all";
@import "styleguide/modules/_all-no-grid";
@import "subfolder/styles"
// Omitting rules not relevant to the problem
Run Code Online (Sandbox Code Playgroud)

styles.css.scss

// Same as above, included for completeness
@import "styleguide";
@import "styleguide/grid/_grid";
@import "styleguide/modules/_all-grid";
// Omitting rules not relevant to the problem
Run Code Online (Sandbox Code Playgroud)

解决方案

有没有人遇到过这样的事情?有没有可能导致这种情况发生的已知问题?

小智 2

我猜这是修改 styles.css.scss 文件中的路径的简单问题。如果您的样式指南目录不在您的子文件夹中(看起来并非如此),则必须将导入路径指向 styles.css.scss 中的上一级。如果是这种情况,请尝试:

@import "../styleguide";
...
Run Code Online (Sandbox Code Playgroud)

由于 application.css.scss 位于上一级,因此它在导入期间可以识别这些路径,而 styles.css.scss 则不能。