Медиа-запросы не работают после компиляции с Webpack из SCSS

Question

У меня есть следующая таблица стилей SCSS

.Header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  background-color: #ffffff;
  box-shadow: 0 0 15px rgba(0,0,0,.1);
  z-index: 999;
  display: flex;
  justify-content: space-between;

  @media screen and (max-width: 900px) {
    flex-flow: column wrap;
  }

  @media screen and (max-width: 565px) {
    flex-flow: column;
    justify-content: stretch;
  }

  &__Nav {
    display: flex;
    flex-flow: row;
    position: relative;
    margin: auto;
    justify-content: space-around;

    @media screen and (max-width: 565px) {
      flex-flow: column;
    }

    &--left { order: 0; }

    &--right { order: 2; }
  }

  &__Logo {
    display: flex;
    flex-flow: row;
    position: relative;
    margin: auto;
    order: 1;

    @media screen and (max-width: 900px) {
      order: 0;
    }
  }
}

Медиа-запросы присутствуют в скомпилированном коде, но кажется, что они не применяются, поскольку при изменении размера окна свойства flex-flow не изменяются, как и порядок элементов. Что может вызвать эту проблему?

ОБНОВЛЕНИЕ - У меня есть обновления SCSS и скомпилированный код по ссылке. Тем не менее, это не работает, как ожидалось.

ОБНОВЛЕНИЕ 2 - Проблема была решена и ссылки были удалены. Это была проблема только с моими уроками.

Answer 1

ваш конфиг веб-пакета в порядке. медиазапросы в строке 75: https://pastebin.com/CcTQy39W

@media screen and (max-width: 900px) {
    .Header {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column wrap;
        flex-flow: column wrap
    }

    .Header__Logo {
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
        order: 0
    }
}

@media screen and (max-width: 595px) {
    .Header {
        -webkit-box-pack:stretch;
        -ms-flex-pack: stretch;
        justify-content: stretch
    }