当'vue-cli-service build'(Webpack)与d3.js一起运行时,'无法读取属性'document'(未定义),

jvlzgdj9  于 2022-11-12  发布在  Webpack
关注(0)|答案(1)|浏览(138)

我使用的是GAE SE和@vue/cli-service 3.0.1
当部署应用程序时,我执行vue-cli-service build --modern并在GAE SE中提供输出。

...
- url: /static
  static_dir: static
  application_readable: true

- url: /css
  static_dir: static/css
  application_readable: true

- url: /js
  static_dir: static/js
  application_readable: true
...

当我在浏览器中看到网站时,没有呈现任何内容,而在控制台中显示
未捕获的类型错误:无法读取未定义的属性'document'

var d3 = {
    version: "3.5.17"
  };
  var d3_arraySlice = [].slice, d3_array = function(list) {
    return d3_arraySlice.call(list);
  };
  var d3_document = this.document; // Error is here
  function d3_documentElement(node) {
    return node && (node.ownerDocument || node.document || node).documentElement;
  }

我使用的一个库依赖于D3.js,错误与它有关。
在本地环境中做vue-cli-service serve没有错。
如何让d3.js在生产环境中工作?

v1l68za4

v1l68za41#

我不确定我有一个完整的答案,但是这个.document不起作用,因为'this'引用了vue对象。您必须直接引用Dom。
您可以使用下列选项之一:

  • 没有“this”:变量d3_document =文档;
  • 此.$el;
  • 此.refs文件(与设置参考文件结合https://v2.vuejs.org/v2/api/#ref)

相关问题