sassnode-sass

How extend placeholder selector in Sass using @use rule

I have _extandable.scss file with one placeholder selector:

%text-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

and I'm trying to use it in another file:

@use 'extendable';

.text-ellipsis {
  @extend extendable.%text-ellipsis;
}

The output of sass-loader is an error:

SassError: Expected identifier.
   ╷
4  │   @extend extendable.%text-ellipsis;
   │                      ^
   ╵
  src/assets/styles/_component.scss 4:22  @import

What's the right way of importing of placeholder selectors using @use rule?

Solution

  • After some investigation I've found out that it's incorrect syntax. Placeholder selectors have global scope during compiling, so we cannot write like this and we don't need to do it.