Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

161
Visualizações
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 à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda