Background image doesn't work on Safari v14 Catalina

Question

I have my project almost done, but faced the issue that background image doesn't work on MacOS Catalina Safari version 14. Do you happen to know where the problem can be? Thank you in advance, ohh. I also should mention that project is written on React with TS.

.image {
  width: calc(100vw - 48rem);
  height: 100vh;
  background: url('../../public/img/auth-bg.jpg') left center no-repeat;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  @include mobile() {
    width: 0;
  }
}

Answer 1

try This, public URL is base Url in the project you can it like this

.image {
  width: calc(100vw - 48rem);
  height: 100vh;
  background: url('/img/auth-bg.jpg') left center no-repeat;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  @include mobile() {
    width: 0;
  }
}