I am about to convert a lengthy Processing sketch to p5.js. Currently the code is defined in several files (a common driver, some objects/classes, etc) and I’d like to keep them separate. This was doable with the Processing IDE. Essentially I’m looking for something like the “c” language’s #include.
Any suggestions?
Thanks.
---
Yes, that editor is much like the Processing IDE. However, I don’t want to use it if possible. I would prefer to use my editor of choice and maintain my files locally. Admittedly I never signed up – I was assuming that the files are maintained on the p5 site, again, not my preference. Also, I will still need the feature I am seeking, something like #include, if I want to execute the javascript outside of the p5 editor.
---
> [@jarlook](#):
>
> I am about to convert a lengthy Processing sketch to p5.js.
1st you have to decide if it’s gonna be global or instance mode approach: 🌐
- [p5.js overview · processing/p5.js Wiki · GitHub](http://GitHub.com/processing/p5.js/wiki/p5.js-overview#instantiation--namespace)
You can see both approaches in the repo below: 😀
> **[GitHub - GoSubRoutine/Ball-in-the-Chamber: JS Native Modules coded in TS...](https://github.com/GoSubRoutine/Ball-in-the-Chamber)**
>
> JS Native Modules coded in TS & CS. Contribute to GoSubRoutine/Ball-in-the-Chamber development by creating an account on GitHub.
---
did you even look at the code? or download it?
you not need to register/login for this, but well you should know how to click on the little arrows to find file/path …
it does not matter what editor or environment you use
i make that example for you to show one way how to do the multi file thing
( comparable with the multi \*.pde in processing IDE JAVA mode. )
and commented all entries!
---
Sorry kll, I clicked your link to the editor but I did not see the example you cite. And if, by the little arrows, you are referring to the p5 menu bar items (e.g., File, Edit), I see nothing that would lead me to the example.
---
yes that “\>” little arrow is much too small!
ok, i give up,
i print it here:
* * *
sketch.js
```auto
function setup() {
createCanvas(400, 400);
rectMode(CENTER);
}
function draw() {
background(200,200,0);
translate(width/2,height/2);
my_rectangle(); // see file my_function.js / see index.html
}
```
my\_function.js
```auto
/*
file: my_function.js
called in index.html
used in sketch.js
*/
function my_rectangle() {
push();
fill(0, 200, 0);
stroke(0, 0, 200);
strokeWeight(20);
rect(0, 0, 100, 100);
pop();
}
```
index.html
```auto
```
---
as you not use the online editor it does not matter,
still i recommend that for communication/questions about p5.js
you register and use it to ask for help here but play together with your MVCE code online.
so now you see the example code / here above / and online /
did you get the idea?
instead #include use index.html script
---