JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://owlcarousel2.github.io/OwlCarousel2/assets/owlcarousel/owl.carousel.js"></script>
<link rel="stylesheet" href="https://owlcarousel2.github.io/OwlCarousel2/assets/owlcarousel/assets/owl.carousel.min.css">
<div class="mfp-with-zoom owl-carousel">
  <div class="item"><a href="#"><img src="https://avatanplus.com/files/resources/mid/58fb2c7a05c0e15b9525bca8.jpg"></a></div>
  <div class="item"><a href="#"><img src="https://avatanplus.com/files/photos/mid/58fb24136c94315b9504ebf5.jpg"></a></div>
    <div class="item"><a href="#"><img src="https://avatanplus.com/files/photos/mid/5903730201ed315bb5793fd8.jpg"></a></div>
</div>

CSS

.owl-carousel img {
  height: 150px;
  width:auto;
}

.owl-carousel .owl-item img{
  width:auto;
}

JavaScript

$('.owl-carousel').owlCarousel({
		loop:true,
		margin:10,
		nav: true,
    autoWidth:true,
    
		navText: [
			"назад",
			"вперед"
		],
		//items:5,
		responsive:{200:{items:2},600:{items:2},1000:{items:2}},
		lazyLoad : true,
	});