使用Webpack

Question

我最近将PostCSS，Gulp和Webpack整合到我的工作流程中，但是学习曲线非常陡峭（尤其是Webpack！）而且我在编译d3时遇到了问题。我已经使用npm install d3 --save安装了d3并尝试将其导入为：

var d3 = require("d3");

哪个不起作用。我尝试安装loader，添加

     new webpack.ProvidePlugin({
        d3: "d3"
    }),

到我的webpack.config文件并导入为

var d3 = require("d3!");

也没有用。我也试过了 here 和here (last answer re the loader)这些东西。

我的浏览器出现以下错误：

Uncaught ReferenceError: d3 is not defined

gulp在命令行中给出了以下错误：

..../node_modules/loader-runner/lib/loadLoader.js:35 throw new Error("Module '" + loader.path + "' is not a loader (must have normal or pitch function)");

我的代码仓库是here。

提前致谢！

Answer 1

我想我会指出d3从v3到v4的更新是非常具有破坏性的。我遇到了与你提到的问题类似的问题，直到我意识到d3代码在几乎所有情况下都发生了变化。

通过使用

，我能够通常使用webpack导入d3（作为节点模块安装）

import * as d3 from "d3";

之后，错误使得它看起来没有导入d3，但这是因为我使用的是d3 v3样式代码。

例如：

d3.layout.pie() 

现在只是：

d3.pie()

重构后，一切都按预期工作。 我不确定这是否是你问题的原因，但这是值得注意的事情。