search

rails / sass-rails

Ruby on Rails stylesheet engine for Sass
MIT License
860 stars 333 forks source link

Variables are not available in a file named "_elements.text.scss" #391

Closed tomsabin closed 5 years ago

tomsabin commented 7 years ago

Our project is following a CSS architecture called ITCSS. We have files prepended with the layer they're declared at, e.g. Settings and Elements.

_settings.colors.scss contains sass variables. It is loaded before other partials.

_elements.paragraphs.scss use the variables declared above. All is well, until I rename this file to _elements.text.scss, then all of a sudden I get an "Undefined variable" error.

Please see the sample Rails application here: https://github.com/tomsabin/sass-rails-issue-391.

https://github.com/tomsabin/sass-rails-issue-391/commit/1f378cd6bd0e83f812579dc1bed66cf67a746fff adds the working version with _elements.paragraphs.scss. You can point HEAD to this commit and see the Rails application is working fine.

Then, check out the latest commit https://github.com/tomsabin/sass-rails-issue-391/commit/203110eb9934d26e99c9b3c68c4dc310114481cd and restart the server. You should see the Undefined variable: "$color-grey-light". error.

(I was not able to recreate it with just the sass gem)

RemyMaucourt commented 7 years ago

I have kind of the same problem with a file named variables.scss. I can see it's compiled, but variables are not availables to other files. If I'm importing manually the variable.scss file in the other files, it works.

I don't know if the pb is from sass or from the rails asset pipeline.

RemyMaucourt commented 7 years ago

looks like it's linked to that https://github.com/rails/rails/issues/28628

jamescook10 commented 5 years ago

For anyone that stumbles upon this issue, I think I have narrowed it down to the use of the word 'text' as a filename after _elements.. My suspicion is that Sass is treating the .text part of the file name as some kind of file extension and for whatever reason the variables are not being defined.

Strangely, if I comment out the variable definitions, refresh the page and then uncomment out the variable definitions and refresh the page again, they then start working.

I discovered this bug when creating a file called _helpers.text.scss in the same codebase @tomsabin initially discovered this issue in.

@tomsabin curious if you ever figured this out and/or found out what's actually going on? Especially the fact that I can get it working by commenting -> refreshing -> uncommenting -> refreshing! 😱

tomsabin commented 5 years ago

@tomsabin curious if you ever figured this out and/or found out what's actually going on? Especially the fact that I can get it working by commenting -> refreshing -> uncommenting -> refreshing! 😱

I'm afraid not 😞