css - rails - 在样式表下创建一个文件夹

Question

在我的 app/assets/stylesheets 下，我创建了一个文件夹 components 因为我喜欢为我的每个 html 组件创建特定的样式。这样，在我实际的 sass 文件 (some_page.scss) 中，我可以根据需要做一些导入。

为了视觉效果，现在的文件夹结构如下所示:

- app
  - assets
    - stylesheets
      - components
        _component1.scss
        _component2.scss
      application.css
      page-specific.scss

现在在 components 下我有

_colors.scss // declaring colors for my app
_other_stuff.scss // other stuff...

通常在进行导入时，我会先导入颜色，以便我可以在其余组件中使用它们。但是 Rails 正在提示:

Showing /Users/abdulahmad/Desktop/rails/password-service/app/views/layouts/application.html.erb where line #5 raised:

Undefined variable: "$green".

我是否应该做一些特别的事情来告诉 rails 我想在 components 文件夹中编译我的 sass？还是由于其他原因引发此错误？

顺便说一句，这是我的页面特定的 scss 文件的内容:

@import 'components/colors';
@import 'components/inputs';

Answer 1

将您的 application.css 重命名为 application.css.scss

然后 application.css.scss 文件必须如下所示。

@import "components/*";
@import "page-specific";