Angular2 e Boostrap

angular

#1

Comprei o livro ‘Crie aplicações com angular’ e ao implementar o código do projeto final, existem informações pendentes.

Por exemplo, não é explicado onde você deve executar o comando “npm install bootstrap@next --save” . Pela lógica, deve ser na raiz do projeto, até porque é lá que está o arquivo package.json. Logo depois é falado para inserir o seguinte conteúdo no arquivo styles.css “@import
’~bootstrap/dist/css/bootstrap.min.css’;” . O que ocorre é que no console do navegador diz: “Failed to load resource: the server responded with a status of 404 (Not Found) bootstrap.min.css” .

O que estou fazendo de errado?


#2

Olá Hargon, tudo bem?

O comando npm install bootstrap@next --save deve ser feito na raiz do projeto para a dependência ser salva no package.json do projeto.

Sobre o erro do bootstrap, vá ao arquivo package.json e verifique a última versão instalada do seu bootstrap, provavelmente será "bootstrap": "^4.0.0-beta.2".

Retire o ^ e deixe somente dessa forma "bootstrap": "4.0.0-beta.2".

Rode a aplicação novamente (ng serve) no console.

Fiz os testes usando a versão do angular cli - "@angular/cli": "1.0.0-beta.32.3", e também a versão "@angular/cli": "1.6.1",.

Sobre o bootstrap testei nas versões - "bootstrap": "4.0.0-alpha.6", e também na versão "bootstrap": "4.0.0-beta.2".

Em resumo é somente retirar o ^ do package.json.

Desde já fico a disposição para ajudar em outras dúvidas.

Att
Thiago Guedes


#3

Obrigado pelo retorno Thiago_Guedes.

Como criei o projeto ontem, a minha versão do Bootstrap é "bootstrap": "^4.0.0-beta.3" .

Alterei para versão que você disse e o erro mudou para:
** GET http://localhost:4200/bootstrap/dist/css/bootstrap.min.css net::ERR_ABORTED addStyles.js:225**

Meu angular cli- está na versão angular-cli: 1.0.0-beta.28.3


Eu acabei de alterar o styles.css para
@import '../node_modules/bootstrap/dist/css/bootstrap.min.css';

E deu certo. Mas se essa não é a melhor maneira, gostaria de saber, se possível, o que devo corrigir para seguir as boas práticas mencionadas no livro.

Desde já agradeço.