p5js-typescript-fusebox

KO | EN

gitlite — search

#hacktoberfest #ai #typescript #llm #go #android #docker #java #windows #cli #kubernetes #vue #security #open-source

p5js-typescript-fusebox

(★ 29)

Template for p5Js projects that uses Typescript and Fusebox.

p5js-typescript-fusebox Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# p5Js + Typescript + Fusebox
Template for [p5Js](https://p5js.org/) projects that uses [Typescript](http://www.typescriptlang.org) and [Fusebox](https://fuse-box.org) for fast, iterative development.  I created this to help port a legacy [Processing Java](https://processing.org) application to p5Js.  Porting it to Typescript with Fusebox meant I had little dependency overhead to worry about (see package.json).

## Getting Started
* I highly recommend [n](https://github.com/tj/n) or [nvm](https://github.com/creationix/nvm) for installing Node - I used Node 14.x & npm 6.x.
* Clone this project
* `npm i`
* Run `npm run sketch`
* Open http://localhost:4444
* Modify `src/sketch.ts`, save it, watch sketch auto-reload in browser.
* Have fun!

## Publishing to Open Processing [Experimental]
You can publish your sketch to [Open Processing](https://www.openprocessing.org).  This repo is posted for you [as an example](https://www.openprocessing.org/sketch/561721).
* Run `npm run dist`
* Copy/Paste the contents of `./dist/app.js` to your sketch.
* Add the mp3 from `dist/resources` to the sketch Files tab.
* Turn on p5.Sound in your Sketch

## Random
* **Source Maps** are turned on by default which means you can set breakpoints in the browser or in Visual Studio Code (use Chrome Debugging extension).
* Fusebox vs Webpack - Fusebox has incredibly fast hot module reloading and native Typescript support.  QED for me.
  * UPDATE - The upgrade from Fusebox 3 to 4 was way harder than it needed to be.  The hardest part is there was absolutely zero migration guide.  This made it hard but then some of the powerful things such as bundle instructions were replced with, well, magic.  It's still very fast but the lack of any real documenation means I will move to either Parcel or Webpack at some point.

p5js-typescript-fusebox

p5js-typescript-fusebox Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

p5js-typescript-fusebox

p5js-typescript-fusebox Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README