Como adicionar bootstrap a um projeto angular-cli

Queremos usar o bootstrap 4 (4.0.0-alpha.2) em nosso aplicativo gerado com angular-cli 1.0.0-beta.5 (com nó v6.1.0).

Após obter o bootstrap e suas dependências com o npm, nossa primeira abordagem consistiu em adicioná-los aoangular-cli-build.js:

  'bootstrap/dist/**/*.min.+(js|css)',  
  'jquery/dist/jquery.min.+(js|map)',  
  'tether/dist/**/*.min.+(js|css)',

e importá-los em nossaindex.html

  <script src="vendor/jquery/dist/jquery.min.js"></script>
  <script src="vendor/tether/dist/js/tether.min.js"></script>
  <link rel="stylesheet" type="text/css" href="vendor/bootstrap/dist/css/bootstrap.min.css">
  <script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script>

Isso funcionou bem comng serve mas assim que produzimos uma compilação com-prod sinalizar todas essas dependências desapareceram dedist/vendor (surpresa !).

Como pretendemos lidar com esse cenário (ou seja, carregando scripts de autoinicialização) em um projeto gerado com angular-cli?

Tivemos os seguintes pensamentos, mas na verdade não sabemos para onde ir ...

usar uma CDN? mas preferimos exibir esses arquivos para garantir que eles estarão disponíveis

copiar dependências paradist/vendor depois do nossong build -prod ? Mas isso parece algo que o angular-cli deve fornecer, pois "cuida" da parte da construção?

adicionando jquery, bootstrap e tether no src / system-config.ts e, de alguma forma, atraí-los para o nosso pacote no main.ts? Mas isso parecia errado, considerando que não vamos usá-los explicitamente no código do aplicativo (diferente do moment.js ou algo como lodash, por exemplo)

questionAnswers(27)

yourAnswerToTheQuestion