0

Estou com um problema ao integrar os scripts bootstrap.js, popper.js e jquery.js no meu projeto Angular. Já realizei algumas tentativas, mas nada resolveu até o momento.

Os meus scripts estão sendo incorporados da seguinte forma:

"styles": [
              "./node_modules/bootstrap/scss/bootstrap.scss",
              "src/styles.scss"
],
"scripts": [
              "node_modules/jquery/dist/jquery.js",
              "node_modules/popper.js/dist/popper.js",
              "node_modules/bootstrap/dist/js/bootstrap.js"
            ]

Uma observação importante: O Css do Bootstrap esta sendo carregado corretamente e funcionando perfeitamente. Já tentei colocar um ./ para tentar pegar a referência do diretório atual.

3
  • Amigo pq vc colocou .js duas vezes? O nome da sua pasta tem .js? vc colocou "popper.js/dist/popper.js" não seria apenas "popper/dist/popper.js"
    – hugocsl
    Commented 1/09/2018 às 19:35
  • Infelizmente não, @hugocsl. O caminho é aquele mesmo. Commented 1/09/2018 às 19:39
  • Como vc esta usando sass se faz diferente para importar o estilo, veja minha resposta. Commented 6/09/2018 às 8:09

2 Respostas 2

1

O recomendado e seguir a documentação oficial:

https://github.com/angular/angular-cli/wiki/stories-include-bootstrap

Outra sugestão seria usar bibliotecas como ng-bootstrap.

0

tente o seguinte:

"styles": [  
          "src/styles.css",  
          "./node_modules/bootstrap/dist/css/bootstrap.min.css"  
        ],  
        "scripts": [              
          "./node_modules/jquery/dist/jquery.min.js",  
          "./node_modules/popper.js/dist/umd/popper.min.js",  
          "./node_modules/bootstrap/dist/js/bootstrap.min.js"  
        ]   

Verifique se os seguintes passos foram feitos antes

Bootstrap tem dependência de Jquery e Popper js. Para instalar o Jquery e o Popper js, digite os seguintes comandos.

Para instalar o jQuery digite:

npm install jquery --save

Instale o popper.js com este:

npm install popper.js --save

E para o Bootstrap 4, este aqui:

npm install ngx-bootstrap [email protected]

Referência (Segundo Método): https://www.c-sharpcorner.com/article/how-to-install-jquery-popper-and-bootstrap-in-angular/

Também faça o seguinte: Abra o arquivo 'src/styles.css' e inclua, no início, esta linha:

@import "~bootstrap/dist/css/bootstrap.css";

Isso fará que o estilos do BootStrap sejam importados.

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 .