javascript - 为什么我的 React 应用程序的 Chrome 控制台中 d3 未定义？

Question

我正在我的 React 应用程序中导入 d3.js 库，如下所示:

import * as d3 from "d3";

我正在创建一个基本的世界地图，它也可以在浏览器中正确显示。但是，当我尝试在 Chrome 控制台中执行类似操作时:

d3.select("path")

我收到错误:

Uncaught ReferenceError: d3 is not defined

我想这与 React 的工作原理有关，作为 React 的新手，我不知道我现在在这里缺少什么。有人可以帮忙吗？

Answer 1

因为 webpack(或任何其他绑定(bind)器)将其保留在模块范围内。为了防止模块之间的冲突， bundler 用函数包装模块。您可以将所有导入视为局部函数变量:

function yourModule(require) {
  const d3 = require('d3');

  // you can use d3 here within your module
}

you're not able to use it here, somewhere outside