vscodeで.scss保存時に.scss自体にautoprefixerが走ってしまうのを止めたい

Question

vscodeの拡張から
live sass compilerの更新されている方のv5.1.1と

Autoprefixerのv3.0.1をインストールしました。

###setting.jsonは次のように書きました。

  "liveSassCompile.settings.formats": [
    {
      "format": "expanded",
      "extensionName": ".css",
      "savePath": "~/css"
    }
  ],

  "autoprefixer.ignoreFiles": ["scss"],
  "autoprefixer.options": {
    "grid": "autoplace",
    "browsers": ["last 2 versions", "ie >= 11", "Android >= 4", "ios_saf >= 8"]
  },
  "autoprefixer.formatOnSave": true

• 保存時にautoprefixerのformatが有効
• ignorefilesでscssが変換されるのを除外

autoprefixerの設定がうまく言っているか確認する為に
"grid":"autoplace"をつけて下記を変換しました

###保存前のscss

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto auto;
  grid-gap: 1em;
}

###これで保存すると、scssが次のように書き換えられてしまいました。

.grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1em 1fr 1em 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  -ms-grid-rows: auto 1em auto 1em auto;
  grid-template-rows: auto auto auto;
  grid-gap: 1em;
}
.grid > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.grid > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.grid > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
.grid > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.grid > *:nth-child(5) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
.grid > *:nth-child(6) {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
}
.grid > *:nth-child(7) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}
.grid > *:nth-child(8) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}
.grid > *:nth-child(9) {
  -ms-grid-row: 5;
  -ms-grid-column: 5;
}

###こちらは出力されたcss

.grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1em 1fr 1em 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  -ms-grid-rows: auto 1em auto 1em auto;
  grid-template-rows: auto auto auto;
  grid-gap: 1em;
}

.grid > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.grid > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.grid > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}

.grid > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.grid > *:nth-child(5) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}

.grid > *:nth-child(6) {
  -ms-grid-row: 3;
  -ms-grid-column: 5;
}

.grid > *:nth-child(7) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}

.grid > *:nth-child(8) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}

.grid > *:nth-child(9) {
  -ms-grid-row: 5;
  -ms-grid-column: 5;
}

-ms-grid-rows関係が出力されてるので、
"grid":"autoplace"のオプションはうまく機能しているようです。
つまりautoprefixerの設定は間違っていないかなと思っているんですが
そうするとなぜ"autoprefixer.ignoreFiles": ["scss"],が無視されるのでしょうか?

###autoprefixerの設定画面

ちなみに、format on saveを外すと
scss保存時にautoprefixerが走らず、scssはそのまま保存され

live sass compilerで出力されたcssには"autoprefixer.options":の設定が適用されませんが
autoprefixerは有効なようで
下記のような変換はされました

body {
  strong {
    font-weight: 800;
    animation-duration: 0.7s;
  }
}

body strong {
  font-weight: 800;
  -webkit-animation-duration: 0.7s;
          animation-duration: 0.7s;
}

どうにかscss本体にautoprefixerを適用させずに保存する方法は無いものでしょうか？

Answer 1

Sassのプラグインだと「Live Sass Compiler」が一番有名かと思いますが、こちらは公式推奨のDarts Sassにまだ対応してない、って知ってましたか？

この点を知らないと、今後Sassの機能を上手く使えなくなってしまいます。

https://crestadesign.org/sass-vscode/

どうもlive sass compilerは辞めたほうが良さそうな感じなんですね
とはいえ、上記サイトで紹介されている
DartJS Sass Compiler and Sass Watcherにもoption設定はなさそうでした。