Pixi v5 - Community Filters Without Packager

[spacerex]

This is also my first post here, but I've been reading these forums for a month. Love this community and projects. You all are amazing people. I am myself an experienced full stack developer, who wants to create a game of his dreams as a side project ?

I've been playing with Pixi for a few weeks, and I like it so far. I am having some problems with pixi-filters v3.0.2 on pixi.js v5.0.2. I was able to get @pixi/filter-shockwave to work with a Rollup package bundler. But I hate having to rebundle everything after a tiny code change in order to test.

I prefer an old fashioned way of adding library files via a <script> tag. Is there a way to manually add a filter such as ShockwaveFilter to the project without having to use a bundler? I see that in pixi v3 it was straight forward (http://jsfiddle.net/up209d/tdetg2h3/)

Thanks!

[bigtimebuddy]

Yes, there is!

Here's an example of Shockwave that you could include w/ a `<script>` element.

https://cdn.jsdelivr.net/npm/@pixi/[email protected]/dist/filter-shockwave.js

All filters are published to NPM with bundler file versions ("lib" folder) and a browser version ("dist" folder). You can use jsdelivr or other CDN that allows you to include files from published NPM versions.

[spacerex]

Ah. Thank you! Turned out that in addition to this, the pixi-viewport library was overwriting all filters for me. After inspecting it's code it turns out that David's viewport is messing too much with PIXI objects. I probably need to write my own simple viewport...

Thank you for your help!

[ivan.popelyshev]

@spacerex dont forget to share it later  If you need any help with filters and their coordinates systems, you know who you're gonna call. I'll just leave it here: https://github.com/pixijs/pixi.js/wiki/v5-Creating-filters