如何让p5.js在WordPress中工作

Question

上下文

我正在尝试让p5.js库在使用Sage starter主题的Wordpress安装版本上工作。

所有文件似乎都在他们的位置：

p5.min.js位于dist文件夹中。

。在body的末尾p5.min.js正确排队：

<script type="text/javascript" src="//localhost:3000/app/themes/tlm/dist/scripts/p5.min.js"></script>

问题：

当我尝试创建p5的实例时，我得到'p5' is not defined eslint错误。

var sketch = function(p) {
  p.setup = function () {
    p.createCanvas(500, 500);
    p.background(200);
  };
};
new p5(sketch);

我的JS水平很低。为什么p5未定义？我该如何调试呢？

Answer 1

必须将p5变量设置为全局变量。

如何？

只需将此行添加到JavaScript文件顶部

/ *全局p5 * /