Javascript：导入错误，无法找到变量

Question

我从GitHub https://github.com/mcaule/d3-timeseries下载了这个d3 JavaScript项目，然后创建了一个HTML页面（index.html）来运行该项目。 这是index.html：

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="./d3_timeseries.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.10.0/d3.min.js"></script>
<script type="text/javascript" src="./d3_timeseries.js"></script>
<script type="text/javascript" src="https://mcaule.github.io/d3-timeseries/dist/create-example-data.js"></script>
<body>
  <div id="chart"></div>

  <script>
    var data = createRandomData(80,[0,1000],0.01)
    var chart = d3_timeseries()
                  .addSerie(data,{x:'date',y:'n',diff:'n3'},{interpolate:'monotone',color:"#333"})
                  .width(820)
    chart('#chart')
  </script>
</body>
</html>

我在d3_timeseries.js中有一个问题，出现以下两个错误：

注意：我不想使用最小文件

Answer 1

链接的确切文件d3_timeseries.js编写方式无法在浏览器中使用而无需处理。

它的第一行import * as d3 from "d3"; 无论使用哪种浏览器，都会失败，因为"d3"不是可从浏览器上下文正确评估的URL。 它不是相对网址，也不是

看起来打算由webpack或其他脚本捆绑程序使用。 如果您在webpack上下文中使用它来捆绑代码，它将从node_modules加载"d3" 。

我知道您说过“您不想使用最小文件”，因此您的选择要么是编译自己的捆绑软件，要么只是使用/dist文件夹中的最小文件。

Answer 2

我假设您使用了src目录中的文件。 这不是常规的javascript文件，而是节点。 幸运的是，作者正在dist文件夹中查找看上去是网络安全版本的文件。 该版本已缩小，丑化并通过了通天塔。

您很少想包含src文件或未丑化的文件。 这将导致您的网页加载不需要的多余空白数据。

Javascript：导入错误，无法找到变量

问题描述

2 个解决方案

解决方案1
1 2018-07-18 15:55:57

解决方案2
0 2018-07-18 15:57:40

Javascript：导入错误，无法找到变量

问题描述

2 个解决方案

解决方案1 1 2018-07-18 15:55:57

解决方案2 0 2018-07-18 15:57:40

解决方案1
1 2018-07-18 15:55:57

解决方案2
0 2018-07-18 15:57:40