javascript - 如何从 TypeScript 项目中调用 JavaScript 库?

标签 javascript angular d3.js typescript webstorm

我正在处理现有的 TypeScript AngularJS 项目。现在我想使用 d3js 但要这样做我需要手动下载 d3js typescript (事实证明 d3 是由一百万个文件组成的)然后是 d3js min javascript。公司代理不允许我使用工具来下载/管理依赖项等,所以我只有手动选项。

因此,我更喜欢简单地在 index.html 中导入 d3js 并直接从 TypeScript 调用 d3js,而不使用 d3 ts 版本。

所以我会做,例如

var svg = d3.select("svg"),
    margin = {top: 20, right: 20, bottom: 30, left: 40},
    width = +svg.attr("width") - margin.left - margin.right,
    height = +svg.attr("height") - margin.top - margin.bottom,
    g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")");

var x = d3.scaleBand()
    .rangeRound([0, width])
    .paddingInner(0.05)
    .align(0.1);

但随后我收到编译器错误“找不到名称 d3”,有没有办法在 TypeScript 中告诉这个 JavaScript 对象是在别处定义的,它不应该对此做任何假设?

遗憾的是d3 js被拆分成一百万个......我发现它不是很有用,谁会在没有select的情况下使用d3 scale ?这对我来说毫无意义。

最佳答案

定义文件仅在将ts源码编译为js时需要,运行js时不需要。

将它与@types一起使用将是最简单的:

npm install --save @types/d3

如果你不能那样做,那么手动下载定义文件并将它放在你的源附近然后引用它:

/// <reference path="PATH_TO_D3_D_TS" />

如果你不能这样做那么声明它:

declare const d3: any;

这将告诉编译器变量 d3 存在,并且它是 any 类型,因此您不应该因使用它而出现异常。

关于javascript - 如何从 TypeScript 项目中调用 JavaScript 库?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42065024/

相关文章:

javascript - 调用另一个模块函数作为回调 [ES6]

Angular 4 动 Canvas 尔触发器

angular - 除了异步管道之外,还有另一种自动订阅/取消订阅可观察对象的方法吗?

angular - 错误 : cannot find module nativescript-angular/router or its corresponding type declarations

javascript - 如何在放大时显示全文并在缩小时 chop 它

javascript - 比较数组中的连续元素不返回任何内容(javascript)

javascript - 如何在保存到 Mongoose (ExpressJS) 之前格式化模型中的数据

javascript - 解析运行时 Javascript 属性的 Typescript 编译器消息

javascript - 这行代码是如何工作的? D3.js 不透明度函数

javascript - d3.js 3D数组插值