[Refactor] Replace Browserify with Parcel

I’m currently experimenting with the idea of refactoring canvas-sketch and its CLI tools to use Parcel instead of Browserify under the hood. I’m happy to hear any thoughts about this.

Enhancements that will be part of this refactor:

• A more powerful bundler that can handle ES6, CSS, importing PNG assets, and other features that aren’t supported right now.
• An elegant API for using canvas-sketch programmatically, whether as a pure bundler or as a development server.
• Much easier to build an Electron-based wrapper on top of canvas-sketch
• True hot module replacement (this will have a different UX/flow than the current --hot flag, but will be more robust)
• Faster builds and reloads

It will be a major breaking change.

[lutzer]

So Im a little confused… Is it possible with the current canvas-sketch-cli to use es6 import/export syntax to include modules? And if so, how do i do it? I would like to include threejs jsm packages instead of appending them all manually to the global THREE variable… if i try that it tells me ParseError: 'import' and 'export' may appear only with 'sourceType: module'

[mattdesl]

@Greyvy Yes this will be a breaking change. In my own repo of sketches I use canvas-sketch-cli locally, so that each commit is locked to a specific version of canvas sketch CLI:

# in your repo, install the tool locally
npm install canvas-sketch-cli --save-dev

# run with 'npx' to make sure you get the local CLI
npx canvas-sketch sketches/foo.js

This way I can go back to a commit, delete node_modules and npm install again and I will be on the same version of the CLI that was used along with the sketches in that commit.

Yes it would be able to handle import syntax, although I will probably stick with require() in the docs for parity with Node.js (Parcel supports that too).

@ogrodnek Yup TypeScript will work as Parcel supports that out of the box. FWIW you can already use TypeScript with canvas-sketch as in this gist, but you may need to update your dependencies on canvas-sketch and canvas-sketch-cli for it to work:

https://gist.github.com/mattdesl/1e9ab019534838e8c870ae06371be469