node-sass: The "not" pseudo-selector (:not()) missing from compiled code
Hello,
I am experiencing a very strange problem that I could not pinpoint wether it’s libsass or node-sass. But one thing I know for a fact is the different versions of node-sass where the bug (maybe feature?) was introduced. The difference was between versions 4.7.2 and 4.8.1.
I checked sassmeister and everything compiles correctly there. But when compiling via node I am seeing the following:
Example with v4.8.1
package.js:
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"node-sass": "4.8.1"
}
}
index.js:
const fs = require('fs')
const sass = require('node-sass')
sass.render({
file: 'test.scss',
}, (error, result) => {
if(error) return console.log(error)
fs.writeFile('test-out.css', result.css, (err) => {
if(!err) console.log(err)
})
})
test.scss
.btn,
.button {
&.disabled:not(&-default):not(&-outline),
&:disabled:not(&-default):not(&-outline) {
background: #fefefe !important;
color: #111111 !important;
}
}
And the following is the output I am getting:
.btn.disabled, .btn:disabled,
.button.disabled,
.button:disabled {
background: #fefefe !important;
color: #111111 !important; }
The above is also reproducible with latest master.
When I switch versions to 4.7.2 and below I get the expected output:
Example with v4.7.2
package.json:
...
"devDependencies": {
"node-sass": "4.7.2"
}
...
output:
.btn.disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline), .btn:disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline),
.button.disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline),
.button:disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline) {
background: #fefefe !important;
color: #111111 !important; }
Check that the version of node-sass you’re trying to install supports your version of Node by looking at the release page for that version https://github.com/sass/node-sass/releases
Verified above issue on MacOSX and Debian
Read the common workarounds in the TROUBLESHOOTING.md
The only thing I could gather that might help diagnose where this is occurring is the following:
# with version 4.7.2
$ node -p "require('node-sass').info"
node-sass 4.7.2 (Wrapper) [JavaScript]
libsass 3.5.0.beta.2 (Sass Compiler) [C/C++]
# with version 4.8.1
$ node -p "require('node-sass').info"
node-sass 4.8.1 (Wrapper) [JavaScript]
libsass 3.5.0 (Sass Compiler) [C/C++]
So my guess is that this could be libsass?
I might just be horrible at searching GIT issues, but I was unable to find a matching problem.
Validate that it runs with both Ruby Sass and LibSass
Sassmeister works as expected
Prepare a reduced test case for any bugs
Please see above examples
Read the contributing guidelines
I have recreated and pinpointed the issue to specific versions and verified that it still exists in master.
When encountering a syntax, or compilation issue:
Open an issue on
LibSass
. You may link it back here, but any change will be required there, not here
I have a feeling this is a libsass issue, but my examples are using node-sass. If nothing else I hope I can keep this issue for reference and open an issue with libsass if requested to do so.
- NPM version (
npm -v
):5.6.0
- Node version (
node -v
):v8.10.0
- Node Process (
node -p process.versions
):
{ http_parser: '2.7.0',
node: '8.10.0',
v8: '6.2.414.50',
uv: '1.19.1',
zlib: '1.2.11',
ares: '1.10.1-DEV',
modules: '57',
nghttp2: '1.25.0',
openssl: '1.0.2n',
icu: '60.1',
unicode: '10.0',
cldr: '32.0',
tz: '2017c' }
- Node Platform (
node -p process.platform
):darwin
- Node architecture (
node -p process.arch
):x64
- node-sass version (
node -p "require('node-sass').info"
):
node-sass 4.8.1 (Wrapper) [JavaScript]
libsass 3.5.0 (Sass Compiler) [C/C++]
(working version info mentione at top)
- npm node-sass versions (
npm ls node-sass
):
test@1.0.0 /test
└── node-sass@4.8.1
About this issue
- Original URL
- State: open
- Created 6 years ago
- Reactions: 8
- Comments: 21 (7 by maintainers)
Commits related to this issue
- Work around issue in latest node-sass (https://github.com/sass/node-sass/issues/2330) — committed to davidje13/postfacto by deleted user 5 years ago
This is fixed in libsass 3.6+. Do we have any news on an update with that version included?
Is definitely still an issue with 4.12.0. Encountered this trying to migrate from node 8 to 10, and node-sass from 4.5.2 to 4.12.0. Unfortunately the lowest version to support node 10 still has this issue, so we are unable to update until this gets fixed.
As I undersand node-sass 4.12.0 uses libsass 3.5.4 but the issue is fixed in 3.6.0
I’m using node-sass 4.12.0 and the issue is still reproduced