JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css">
<div class="slider">
  <div class="item">
    <img src="http://weknownyourdreamz.com/images/city/city-07.jpg" alt="">
  </div>
  <div class="item">
    <img src="https://cdn.pixabay.com/photo/2016/01/19/18/00/city-1150026_640.jpg" alt="">
  </div>
  <div class="item">
    <img src="http://www.fodors.com/ee/files/slideshows/3-Empire-State-Building.jpg" alt="">
  </div>
</div>

CSS

.item {
  height:400px;
}
.item img {
  display:none !important;
}

JavaScript

$('.slider').slick();
$('.item img').each(function() {
	$(this).parent().css({
  	'background': 'url("'+$(this).attr('src')+'") no-repeat center center',
    'background-size': 'cover'
  });
});