Css gulp autoprefixer中的级联选项

在从gulp autoprefixer插件添加自动固定任务时，我注意到

autoprefixer({ cascade: false })

选择权。我不清楚这个选项在做什么

我在文件中读到：

级联（布尔）：如果CSS未压缩，Autoprefixer是否应该使用可视级联。默认值：true

因此，我用cascade:false和cascade-true将我的SASS编译成CSS，在这两种情况下得到了相同的结果： 我的俏皮话：

使用

autoprefixer（{cascade:false}）

编译到CSS：

使用

autoprefixer（{cascade:true}）

编译到CSS：

所以我的最后一个问题是-自动引用器的级联：false/true选项负责什么？

---

非常感谢您的回答。

事实上，我对此也很好奇，并在

cascade:true

（默认设置）时注意到以下内容：

鉴于此：

body {
    background: black;
  display: flex;
    flex-direction:  row-reverse; }

自动刷新器输出：

body {
  background: black;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse; }

请注意

-webkit-box-orient:horizontal下面几行中的缩进

但是，如果
级联：false
：

body {
  background: black;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse; }

我有同样的问题，我发现：

“为了让你的CSS看起来更漂亮，autoprefixer可以将前缀串接在一起，添加空格，使前缀对齐（不过，如果你使用的是缩微gulp插件，最终不会有任何区别）”

->

body {
    background: black;
  display: flex;
    flex-direction:  row-reverse; }

body {
  background: black;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse; }

body {
  background: black;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse; }