Angular 在咖啡上使用 d3plus 扼流圈答案

【问题标题】：Angular using d3plus chokes on coffeeAngular 在咖啡上使用 d3plus 扼流圈
【发布时间】：2019-04-30 15:09:41
【问题描述】：

我想在 Angular 项目中使用 d3plus。主要是因为它巧妙的文字换行。

我创建了一个d3.lib.ts 文件：

export * from 'd3';
export * from 'd3plus';

'd3plus' 在 IntelliJ 中是红色的。我已经 npm 安装了 d3、d3plus、@types/d3 和 @types/d3plus。这可能有点矫枉过正，但这里肯定有一些东西应该起作用。

当我构建时，我得到：

ERROR in ./node_modules/d3plus/src/init.coffee 1:0
Module parse failed: Unexpected character '#' (1:0)
You may need an appropriate loader to handle this file type.
> ###*
| # @class d3plus
| ###
ERROR in ./node_modules/d3plus/src/libs.coffee 1:26
Module parse failed: Unexpected token (1:26)
You may need an appropriate loader to handle this file type.
> window.d3       = require "d3"
| window.topojson = require "topojson"

似乎 Angular 正在尝试解释 coffeescript，但我不知道它为什么会这样做。为什么不简单地忽略它并使用它上面文件夹中的 d3plus.js？

我该如何让它发挥作用？这是正确的方法吗？

【问题讨论】：

标签： angular d3.js d3plus

【解决方案1】：

尝试 npm i d3plus@next ，它将安装剩余的包。

【讨论】：

我现在收到此错误：./node_modules/d3plus/index.js Module build failed: Error: ENOENT: no such file or directory, open 'C:\Users\me\projects\project\node_modules\d3plus\index.js'。它似乎最终位于 /build 子文件夹中。

【解决方案2】：

我会警告我的答案 - 我正在使用 d3plus 进行文本换行功能。我无法使用某些博客中发布的d3plus.textwrap 功能。我从网上的信息推断，在 d3 v4 中必须使用单独的 d3plus 包。以 textwrap 为例，我们必须使用 d3plus-text 包，然后访问 textwrap 函数，如下所示：

new d3plus-text.textWrap()...

【讨论】：