Блог

Я только что закодировал веб-сайт. Для предварительного просмотра веб-сайта я использовал npm start . Это сработало хорошо, и я смог увидеть анимацию как в Chrome, так и в Safari. Однако после создания веб-сайта с использованием npm run build и затем serve -s build сборка веб-сайта не показывает анимацию в Chrome, но показывает анимацию в safari.

Для справки, вот как выглядит моя таблица стилей CSS.

 @-webkit-keyframes appear {
  from {
    opacity: 0%;
  }
  to {
    opacity: 100%;
  }
}
@keyframes appear {
  from {
    opacity: 0%;
  }
  to {
    opacity: 100%;
  }
}

#projectHead {
  -webkit-animation-name: appear 4s;
  animation-name: appear;
  animation-duration: 4s;
}
  

Отображаются все свойства, кроме анимации. Чтобы дать визуальную оценку, appear должен плавно переходить в 4s. Это происходит за время до сборки, но при просмотре сборки мои анимации в Chrome выглядят как ступенчатая дискретная анимация, в которой я получаю 0% непрозрачности через 1 секунду и 100% непрозрачности через 4 секунды и без перехода между ними.

Кто-нибудь, пожалуйста, помогите! Я пытался отлаживать с утра.