-1

Olá, pessoal. Eu sou iniciante com react e eu estava desenvolvendo uma aplicação front-end e decidi usar o bootstrap pra fazer um slide. Instalei o bootstrap através do npm install e ainda instalei o jquery e o popper.js para poder usar os elementos com javascript. Porém o bootstrap está sobrescrevendo o meu css, não importa a ordem em que eu importo as coisas, continua sobrescrevendo. A importação está assim:

import 'bootstrap/dist/css/bootstrap.min.css';
import $ from 'jquery';
import Popper from 'popper.js';
import 'bootstrap/dist/js/bootstrap.bundle.min';

import './carousel-style.scss';

Alguém pode me ajudar?

4
  • Você está importando o seu css depois do bootstrap? (no código não vejo o seu css). E isso ocorre apenas em produção (depois de você usar o npm run build) ou em desenvolvimento também ( npm start)? Está usando React.Lazy e React.Suspense em algum lugar do app? Commented 19/04/2020 às 13:20
  • 1
    Editei meu trecho de código pra melhor visualização. Sim, estou importando meu css por último e isso ta acontecendo no desenvolvimento, no momento não estou fazendo deploy. Não estou usando nem React.Lazy nem React.Suspense. Commented 19/04/2020 às 13:48
  • Ok. Você pode compartilhar também o código de CSS que está sendo sobrescrito e a interpretação no navegador, mostrando o que substituiu esse CSS? Talvez o HTML referente ao carousel ou o retorno do .jsx ajude a entender melhor o problema também Commented 19/04/2020 às 13:53
  • Ah, esqueci de comentar que no momento essas importações estavam no carousel.js e estavam alterando vários elementos do index.js que é onde eu estou importando o slide. Tentei colocar as importações no index.js antes do css do index, porém continuou da mesma forma. Commented 19/04/2020 às 14:08

1 Resposta 1

0

Estas libs não são orientadas a componentes, logo você deve chamar ela uma unica vez no arquivo main de seu webpack. Normalmente este arquivo seria o app.js.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .