Correct Way to Import D3.js into an Angular 2 Application
<p>There are a lot of discrepancies on the correct way to import and use D3 in an Angular 2.0.0-rc.4 application. I have seen:</p>

<p>1) To be added to the root index.html file:</p>

<pre><code>&lt;script src="https://d3js.org/d3.v4.min.js"&gt;&lt;/script&gt;
</code></pre>

<p>Then using:</p>

<pre><code>Import * as d3 from 'd3';
</code></pre>

<p>in any component file that I want to implement a D3 visual in.</p>

<p>2) Using npm:</p>

<pre><code>npm install d3 --save
typings install d3 --save
</code></pre>

<p>Then still using:</p>

<pre><code>Import * as d3 from 'd3';
</code></pre>

<p>Though with TypeScript 2.0.0 Beta (if I am reading the documentation right) I can do:</p>

<pre><code>npm install --save @types/d3
</code></pre>

<p>Then really use:</p>

<pre><code>Import * as d3 from 'd3';
</code></pre>

<p>-- With both ways, adding the following to the <code>var map = { }</code> to the <em>systemjs.config.js</em></p>

<pre><code>'d3':'node_modules/d3/d3.min.js'
</code></pre>

<p>and adding to the <code>var packages = { }</code></p>

<pre><code>'d3':{main:'build/d3.js',defaultExtension:'js'}
</code></pre>

<p><strong>Can anyone confirm the correct way to implement D3? Thank you.</strong></p>