Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

160
Vistas
Swiper.js blocks page re-render on vercel

I have issue with swiper.js when I deploy my website on Vercel. Swiper stops my website from re-rendering (when I make change content stays the same). On development environment everything works perfectly, but when I push it on Vercel content stays the same. Here is my code:

import React from "react";
import Product from "../../components/PremiumProducts/Product";
// import { Swiper, SwiperSlide } from "swiper/react";
// import SwiperCore, { Autoplay } from "swiper";
// SwiperCore.use([Autoplay]);
// Import Swiper styles
// import "swiper/css";
export default function PremiumProducts(props) {
  const { data } = props;
  console.log(data);
  return (
    <>
      <section className="premium">
        <div className="premium__brands">
          <div className="premium__brands-content center-content">
            {/* <Swiper
              spaceBetween={10}
              slidesPerView={5}
              loop={true}
              autoplay={{ delay: 2000, disableOnInteraction: false }}
              breakpoints={{
                400: {
                  width: 400,
                  slidesPerView: 2,
                  spaceBetween: 5,
                },
              }}
            >
              <SwiperSlide>
                <img src="/Premium/Brands/ime.png" alt="" />
              </SwiperSlide>
              <SwiperSlide>
                <img src="/Premium/Brands/biooil.png" alt="" />
              </SwiperSlide>
              <SwiperSlide>
                <img src="/Premium/Brands/tuf.png" alt="" />
              </SwiperSlide>
              <SwiperSlide>
                <img src="/Premium/Brands/fedor.png" alt="" />
              </SwiperSlide>
            </Swiper> */}
          </div>
        </div>
        <div className="premium__products">
          <div className="center-content">
            <div className="premium__products-content">
              {data.map((product, i) => {
                return <Product key={i} {...product} />;
              })}
            </div>
          </div>
        </div>
      </section>
    </>
  );
}

export async function getStaticProps() {
  const resp = await fetch(`${process.env.SERVER_API}premium-products`);
  const data = await resp.json();

  return {
    props: data,
    revalidate: 1,
  };
}
about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda