How to add bootstrap to an angular-cli project
<p>We want to use bootstrap 4 (4.0.0-alpha.2) in our app generated with angular-cli 1.0.0-beta.5 (w/ node v6.1.0).</p>

<p>After getting bootstrap and its dependencies with npm, our first approach consisted in adding them in <code>angular-cli-build.js</code>:</p>

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

<p>and import them in our <code>index.html</code></p>

<pre><code>&lt;script src="vendor/jquery/dist/jquery.min.js"&gt;&lt;/script&gt;
&lt;script src="vendor/tether/dist/js/tether.min.js"&gt;&lt;/script&gt;
&lt;link rel="stylesheet" type="text/css" href="vendor/bootstrap/dist/css/bootstrap.min.css"&gt;
&lt;script src="vendor/bootstrap/dist/js/bootstrap.min.js"&gt;&lt;/script&gt;
</code></pre>

<p>This worked fine with <code>ng serve</code> but as soon as we produced a build with <code>-prod</code> flag all these dependencies disappeared from <code>dist/vendor</code> (surprise !).</p>

<p><strong>How we are intended to handle such scenario (i.e. loading bootstrap scripts) in a project generated with angular-cli ?</strong></p>

<p>We had the following thoughts but we don't really know which way to go...</p>

<ul>
<li><p>use a CDN ? but we would rather serve these files to guarantee that they will be available</p></li>
<li><p>copy dependencies to <code>dist/vendor</code> after our <code>ng build -prod</code> ? But that seems like something angular-cli should provide since it 'takes care' of the build part ?</p></li>
<li><p>adding jquery, bootstrap and tether in <code>src/system-config.ts</code> and somehow pull them into our bundle in <code>main.ts</code> ? But that seemed wrong considering that we are not going to explicitly use them in our application's code (unlike moment.js or something like lodash, for example).</p></li>
</ul>