小编Vir*_*cle的帖子

我正在尝试创建一个包含 p5 草图的 React 页面，但这样做似乎需要我重写通常在浏览器中运行的标准 JavaScript，以使其作为 React 组件工作。

例如，我想让 React 将此代码提供给客户端：

function setup() {
    createCanvas(600, 600);
}

function draw() {
    background(0);
}

但我找不到一种方法让 React 给客户端一个 JavaScript 文件。相反，我必须创建一个像这样的组件：

export default function(p: p5) {

    p.setup = function setup() {
        p.createCanvas(600, 600);
    };

    p.draw = function draw() {
        p.background(0);
    };

}

这可能看起来微不足道，但如果我和我的团队可以包含我们已经编写的在 React 之外工作的代码，而不必重写所有内容，那么事情就会变得容易得多。

解决问题的一种方法是将文件放在 React 的公共目录中，并与 一起静态提供它index.html，但我更愿意只在客户端需要时才提供文件，而不是一次提供每个文件。如果我可以让一个组件导入 JavaScript 文件并像处理图像一样发送它，那么这正是我正在寻找的。

编辑：抱歉，为了澄清我的意思，Node 是实际提供服务的东西，我想要的是当 React 渲染页面时，它也会运行 JavaScript 代码，就好像它是在<script>HTML 页面的标签中编写的一样。