Melhor Forma de usar o BS em projeto com webpack, scss

[alexandreramosdev]

Olá pessoal, Eu venho sempre fazendo meus projetos com o css puro feito na unha, mas por um motivo de rapidez na entrega do ultimo projeto eu utilizei o Bootstrap, ocorreu tudo bem o projeto ficou bem legal mas o desenvolvimento tive a maior duvida. O bootstrap usar bastante classes prontas ate ai tudo bem, a maior duvida foi em utilizar o 'utilities' deixando uma fila de classe bem grande no html e outras vezes utilizei no custom scss. Como vc utilizam o BS em seu projetos e quais as melhores formas para nao gerar aquenas quantidades imensa de classes no html.

[glauberm]

Importa só as partes do Bootstrap que você está utilizando ao invés do framework inteiro. Por exemplo:

@import "../node_modules/bootstrap/scss/functions";
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/mixins";
@import "../node_modules/bootstrap/scss/reboot";
@import "../node_modules/bootstrap/scss/type";
@import "../node_modules/bootstrap/scss/grid";

Ao invés de:

@import "../node_modules/bootstrap/scss/bootstrap";

A documentação oficial explica melhor: https://getbootstrap.com/docs/4.3/getting-started/theming/#importing

[eliseumds]

Não tenho certeza se isso rola com a configuração padrão do loader, mas tenta importar assim:

@import "~/bootstrap/scss/functions";
@import "~/bootstrap/scss/variables";
...