简体   繁体   English

如何在TS Angle 2应用中使用Plain JS lib

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

I'm building an Angular 2 (rc.4) app with TypeScript and I would like to use D3 . 我正在使用TypeScript构建Angular 2(rc.4)应用程序,我想使用D3

I've installed D3 through npm install, but this is a js module without .d.ts file. 我已经通过npm install安装了D3,但这是一个没有.d.ts文件的js模块。 However, I've found a .d.ts file here . 但是,我在这里找到了.d.ts文件。

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. 如果我在TS文件的该行上设置了一个断点,则可以执行所有操作。 However, the mapped .js version of this file was converted to: 但是,此文件的映射的.js版本被转换为:

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... d3_min_js_1对象存在,但是没有“默认”对象,因此它引发了未定义的异常...

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)? 我如何才能正确地进行此映射(我很确定d3.d.ts不执行任何操作),或者如何在TS文件中使用普通的javascript(编译器无法对其进行修正)?

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM