Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSS-Modules hexadecimal @value properties are undefined #2360

Open
monstersintokyo opened this issue Apr 20, 2017 · 8 comments
Open

CSS-Modules hexadecimal @value properties are undefined #2360

monstersintokyo opened this issue Apr 20, 2017 · 8 comments
Labels
Bug - Confirmed Compatibility - P3 Minorly important for compatibility with the Sass spec and ecosystem Dart Backport Done Dev - Test Written sass2scss

Comments

@monstersintokyo
Copy link

monstersintokyo commented Apr 20, 2017

While migrating to webpack 2 I stumbled upon CSS-Modules @values being undefined. Interestingly enough values like e.g. 1px or rgb values are working fine. Hexadecimal definitions simply seem to vanish. Moreover I am not sure, why there is a {} after the second definition.

test.sass

@value test_1 #555
@value test_2 rgb(0,255,0)

node node_modules\node-sass\bin\node-sass test.sass > test.css produces:

test.css

@value test_1;
@value test_2 rgb(0,255,0) {}

version info:

$ node-sass --version
node-sass       4.5.2   (Wrapper)       [JavaScript]
libsass         3.5.0.beta.2    (Sass Compiler) [C/C++]

Windows 10
$ node -v
v4.8.2

Sassmeister output:

@value test_1 #555
@value test_2 rgb(0,255,0);

Ruby output on win xp host:

@value test_1 #555;
@value test_2 rgb(0,255,0);

/*# sourceMappingURL=test.css.map */

version info:

$ ruby -v
ruby 2.0.0p648 (2015-12-16) [i386-mingw32]

$ sass -v
Sass 3.4.23 (Selective Steve)

I could reproduced the said behaviour since node-sass 3.6.0 with libsass 3.3.6.

Thanks!

@xzyfer
Copy link
Contributor

xzyfer commented Apr 27, 2017

Thanks for the report. I am able to confirm this issue. We don't currently account for @ rules with more than one argument.

@monstersintokyo
Copy link
Author

Any idea, if this will get fixed? Thanks!

@mgreter
Copy link
Contributor

mgreter commented Mar 19, 2018

Closed via #2602

@mgreter mgreter closed this as completed Mar 19, 2018
@mgreter
Copy link
Contributor

mgreter commented Mar 19, 2018

Seems the scss part is still missing, thought it passed locally ...

@mgreter
Copy link
Contributor

mgreter commented Mar 19, 2018

Fixed this specific edge case but there are probably more with @at directives.

@chriseppstein
Copy link
Contributor

@mgreter yes, I don't think sass should have any specific handling for @value like I see in https:/sass/libsass/pull/2602/files#diff-950f6260135ab0fef6f27e24ebd6e863R605

When Sass encounters an at-rule it doesn't know, it should parse the remainder of the at-rule to the first ; or { (ignoring leading or trailing whitespace and accounting for matching quotes and parenthesis) capturing that argument as a string and allowing only for interpolation via #{} to inject SassScript values.

https:/sass/sass/blob/stable/lib/sass/scss/parser.rb#L215-L217

@chriseppstein
Copy link
Contributor

Re-opening so this doesn't get lost, but maybe better to close this and file a new issue?

@chriseppstein chriseppstein reopened this May 2, 2018
@xzyfer
Copy link
Contributor

xzyfer commented May 4, 2018

Thanks @chriseppstein

@nex3 nex3 added the Compatibility - P3 Minorly important for compatibility with the Sass spec and ecosystem label Jun 3, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug - Confirmed Compatibility - P3 Minorly important for compatibility with the Sass spec and ecosystem Dart Backport Done Dev - Test Written sass2scss
Projects
None yet
Development

No branches or pull requests

5 participants