Sass build fails on node-sass ^3.7

[zinigor]

If I try to use dops-components in a project where node-sass is of version 3.7 and higher I get the following error message on build:

Message:
    Module build failed: 
%dashicon {
^
      You may not @extend an outer selector from within @media.
You may only @extend selectors within the same directive.
From "@extend %dashicon" on line 34 of stdin

      in /jetpack/node_modules/@automattic/dops-components/client/scss/extends.scss (line 15, column 1)

I was wondering if there's an easy fix for this? This is going to be a blocker if we decide to move to Node 6.x. cc @jeffgolenski @MichaelArestad

[MichaelArestad]

Let's get rid of @extends. We can do something similar with a mixin for duplicating that kind of thing.

[zinigor]

Thanks for taking a look! @eliorivero has created #26 about that yesterday, is that what you meant?

[MichaelArestad]

@zinigor Yep. Commented.

[cfinke]

I'm still seeing what I think is a related bug when trying to run akismet-react:

ERROR in ./~/css-loader?sourceMap!./~/autoprefixer-loader!./~/sass-loader?sourceMap!./~/@automattic/custom-colors-loader!./~/@automattic/dops-components/client/components/notice/style.scss
Module build failed: 
%noticon {
^
      You may not @extend an outer selector from within @media.
You may only @extend selectors within the same directive.
From "@extend %noticon" on line 35 of stdin

      in /Users/cfinke/projects/akismet-react/node_modules/@automattic/dops-components/client/scss/extends.scss (line 8, column 1)
 @ ./~/@automattic/dops-components/client/components/notice/style.scss 4:14-224 13:2-17:4 14:20-230

Has there been any progress on fixing this that maybe wasn't documented here?

[MichaelArestad]

@cfinke Hmm. I wonder if there is an @extend in the akismet code someplace. That or we missed something. I'm not seeing any extends in the codebase. Do you have an old version of dops-components npm-linked?

[zinigor]

Here's the problem, akismet-react uses a specific commit of dops-components, in which the bug hasn't been fixed yet: https://github.com/Automattic/akismet-react/blob/master/package.json#L21