@extend専用のプレースホルダーセレクタは「%セレクタ名」のように記述します。@extendのプレースホルダーセレクタはCSSとして生成されません。

以下のhtml構造でボタン用のCSS生成に、@extendのプレースホルダーセレクタを利用します。

<div class="c-btn">
  <a class="c-btn-link">リンクテキスト</a>
</div>

<div class="c-btn -black">
  <a class="c-btn-link">リンクテキスト</a>
</div>

<div class="c-btn -small">
  <a class="c-btn-link">リンクテキスト</a>
</div>

Sassは以下のように記述します。

.c-btn {
  &-link {
    @extend %button-style;

    .-black & {
      color: #000000;
      border: 1px solid #000000;
    }

    .-small & {
      font-size: 12rem;
    }
  }
}

%button-style {
  font-size: 24rem;
  font-weight: bold;
  color: #ff0000;
  display: inline-block;
  padding: 20px;
  border: 1px solid #ff0000;
}

コンパイル後のCSSは以下になります。プレースホルダーセレクタである「button-style」はCSSとして生成されていないのが確認できます。

.c-btn-link {
  font-size: 24rem;
  font-weight: bold;
  color: #ff0000;
  display: inline-block;
  padding: 20px;
  border: 1px solid #ff0000;
}

.-black .c-btn-link {
  color: #000000;
  border: 1px solid #000000;
}

.-small .c-btn-link {
  font-size: 12rem;
}