Почему не применяются эффекты transition из scss-файла при использовании webpack?

Проблема с применением эффектов transition из scss-файла при использовании webpack может возникать из-за неправильной конфигурации webpack для обработки scss-файлов и правильной загрузки стилей при сборке проекта.

Чтобы изменить код и применить анимацию градиента фона при наведении мыши, вам необходимо изменить стили в scss-файле. Например, вместо анимации границы можно использовать анимацию изменения фона:

```scss
.element {
  background: linear-gradient(to right, #ff416c, #ff4b2b);
  background-size: 200% 100%;
  transition: background-position 0.5s;

  &:hover {
    background-position: right center;
  }
}
```

Проверьте также правильность подключения scss-файлов в ваших webpack конфигурациях, чтобы стили были корректно обработаны и загружены при сборке проекта.

Угол 0deg означает, что градиент идет снизу вверх. 
 Указание одного значения для свойств background-size и background-position применяется для оси X, что в случае данного градиента визуально никак не сказывается. Вам нужно задавать изменения для оси Y. 
 
background-size: auto 150%;
background-position: 0 40%;
 
 И в transition рекомендуется анимировать только нужные свойства.