How to use plain js lib in a ts angular 2 app

Question

I'm building an Angular 2 (rc.4) app with TypeScript and I would like to use D3 .

I've installed D3 through npm install, but this is a js module without .d.ts file. However, I've found a .d.ts file here .

What I do now (a component):

import d3 from 'node_modules/d3/build/d3.min.js';
//<reference path="../declaration/d3.d.ts" />
//[...]
export class Test {
    constructor() {
        this.object = this.d3.select(...);
    }
}

If I set a break-point on that line in the TS file, I can execute everything just fine. However, the mapped .js version of this file was converted to:

var d3_min_js_1 = require('node_modules/d3/build/d3.min.js');
[...]
this.object = d3_min_js_1.default.select(...);

The d3_min_js_1 object exists, but there is no 'default', so it throws a undefined exception...

How can I get this mapping right (I'm pretty sure d3.d.ts does nothing) or how can a use the plain javascript in the TS-file (without it getting f*cked up by the compiler)?

Answer 1

我希望这个pl客能为您提供帮助： https ://embed.plnkr.co/qM3qrk3swvalQFBh1Db1/