Pixi.js: Import PixiJS as ESM without bundlers
I'm trying to import Pixi in a Snowpack application, but, although the Pixi package on NPM contains a esm file (/lib/pixi.es.js), it can't be loaded directly in browser, as it uses node's native libs (e.g.: url).
Is it possible to import PixiJS as an ES Module, without the use of Rollup, Webpack or any other bundler?
NemoStein
All 10 comments
Rollup, Webpack and Parcel all can provide builtin polyfills for Node’s url and path utils. I’m not familiar with Snowpack, but could you overrides these? There are also public packages (e.g., url) by the same name you could may install alongside?
The other option is to remove any node-like dependencies from the project. I’d first try to find a Snowpack workaround for this problem before we do that. Also, those other bundles mentioned above are all unofficially supported by pixi. A Snowpack-based boilerplate project would be helpful to test this and work out the best way to support this tool too.
bigtimebuddy
on 1 Jul 2020
to support this tool too
That's the thing... I'd like to use no such tools.
Snowpack doesn't transform your code in anyway (it can, but that isn't the point). The idea is to use open web standards only.
NemoStein
on 1 Jul 2020
Just because it’s a web standard doesn’t mean Pixi supports it. There are lots of modern browser features that we don’t support yet because adoption is low or we are still trying to run in a broad array of browsers. This is the first request for running ES modules directly. It’s not a bad idea but not a huge priority at the moment.
The ES build was added to support tree shaking with bundling not to run in the browser using module importing.
If someone wants to take on this task, we would consider a PR.
bigtimebuddy
on 1 Jul 2020
Quite a bummer you guys don't have an es module version.
SagnikPradhan
on 8 Aug 2020
This would be something great to have
mmahandev
on 23 Aug 2020
Okay, I hear you all. We will work on a browser-based ESM bundle.
bigtimebuddy
on 23 Aug 2020
For the time being I created this. The problem I had was that transpiling the libraries in dev mode made it too slow. Hence the solution.
SagnikPradhan
on 23 Aug 2020
@SagnikPradhan 404 broken link 🤔
DrSensor
on 23 Sep 2020
@DrSensor here are the official builds from the dev branch. We don't yet have a release, but these will be in v5.4.0.
- https://pixijs.download/dev/pixi.mjs
- https://pixijs.download/dev/pixi.min.mjs
- https://pixijs.download/dev/pixi-legacy.mjs
- https://pixijs.download/dev/pixi-legacy.min.mjs
Example
https://github.com/bigtimebuddy/pixi.js-browser-module-example
bigtimebuddy
on 23 Sep 2020
@DrSensor Sorry, here is the new link. Ended up turning the simple script into a package.
SagnikPradhan
on 24 Sep 2020
Related issues
courtneyvigo
·
3Comments
readygosports
·
3Comments
softshape
·
3Comments
Darker
·
3Comments
gaccob
·
3Comments
Most helpful comment
Okay, I hear you all. We will work on a browser-based ESM bundle.