IntelliJ IDEA 中的 P5.js？

Question

前几天开始学习p5.js，现在想用IntelliJ IDEA代替p5.j​​s在线编辑器。像setup(),draw()和ellipse()函数这样的大多数东西都按预期工作，但该createCanvas()函数却没有 - 它带有绿色下划线并且错误消息显示“未解析的函数或方法 createCanvas()”。

我尝试使用 VSCode，它运行得很好，但我更喜欢使用 IntelliJ，所以我想知道我是否以及如果是的话，如何让它在 IntelliJ 中工作。

<script src="p5.js"></script> //p5.js is the file with all the code from the official p5js.org homepage.
<script src="sketch.js"></script> //sketch.js is the file where my code that should be executed is located

function setup() { //The setup() function is recognized as expected,
    createCanvas(1000, 1000); //But the createCanvas() function isn't.
}

Answer 1

p5 函数被定义为p5.prototype.<function name> = function(){}，因此 IDE 期望这里有一个命名空间...作为一种解决方法，请尝试安装 p5 类型：在首选项 | 中。语言和框架 | JavaScript | 库，按下载...，p5从列表中选择。这应该可以解决问题

Answer 2

我曾经通过使用Live Edit插件结合分屏 Chrome 和 IntelliJ 来模仿 IntelliJ IDEA 中的 p5js 在线编辑器。该插件将自动在 Chrome 窗口中更新您的 HTML/JS，您可以立即看到对 p5js 代码所做的更改的效果。仅当您在调试模式下运行 HTML/JS 文件时它才会起作用。

这是一个例子：