P5.js Web Editor problem exporting a function

GoToLoop · December 3, 2024, 1:36pm

Those 2 keywords are JS features, and p5.js, which is a frontend library, can’t change that:

GoToLoop/P5-JS-ECMA-Module-Demo/blob/main/src/sketch.mjs

import Animal from './classes/Animal.mjs';
import { pointCoord } from './functions/point_coord.mjs';

const dog = new Animal('Dog');
dog.sayName();

function setup() {
  createCanvas(400, 400).parent('sketch-holder');
}

function draw() {
  background(220);
  pointCoord();
}

globalThis.setup = setup;
globalThis.draw = draw;

github.com

GoToLoop/P5-JS-ECMA-Module-Demo/blob/main/src/classes/Animal.mjs

export default class Animal {
  constructor(name) { this.name = name; }
  sayName() { console.log(this.name); }
}

As I have already mentioned to you on your previous forum thread:

B/c they don’t even acknowledge ECMA Script Modules (ESM / “.mjs”) exist anywhere on their docs, it’s no wonder their “p5.js Web Editor” doesn’t seem to be compatible w/ ESM either!

Pretty much any other JS code hosting/editor solution available should work!

For example, you can try out:

And many others to host JS code + p5.js library!

Topic		Replies	Views
Export SVG file from p5.js? Libraries	14	971	August 11, 2024
External Libraries Do Not Import Properly Into Web Editor Libraries	4	524	July 21, 2020
Using ES6 Modules in the p5.js Web Editor Beginners	4	371	August 7, 2022
P5.js Web Editor - Menu Open? p5.js	6	1533	September 16, 2018
Linking classes between files outside of p5js web editor Beginners	4	267	May 22, 2023

P5.js Web Editor problem exporting a function

Related topics