React項目中使用scss插值語法

1. react項目是使用create-react-app創(chuàng)建的，
2. 通過安裝node-sass: "^4.7.2"和sass-loader"^6.0.7"解析.scss文件，
3. 當(dāng)使用scss的插值#{}時會報錯，不使用的話沒有問題，這是怎么問題？

初次接觸scss，請大佬們指點迷津

• 部分代碼（tabs.scss）

$class-prefix: "tabs";

.#{$class-prefix}{
  &-bar {
    margin-bottom: 16px;
  }

  &-nav {
    font-size: 14px;

    &:after,
    &:before {
      display: table;
      content: " ";
    }

    &:after {
      clear: both;
    }

  }

• 報錯信息

• 配置代碼

• 官網(wǎng)查了下插值語法該是這樣用啊