Webpack configuration for Pixi.js

Pixi.js uses Gulp and Browserify internally, which leads to some problems when trying to use it with Webpack. Here are two configuration you can use to remedy this.

The fast version

This configuration file provides a fake file system where the build script would look up files with brfs using Gulp. This means that files which Pixi.js inlines during the build process will not be included in the final output. As far as I'm concerned, this only involves shaders and filters. You can still use Pixi.js as usual if you don't use any of the built in filters.

The big advantage of this configuration is that build times are very fast.

The slow version

If you need the built in filters, you can use brfs via the transform-loader with this config file. This is quite a bit slower, as Webpack can't cache as much data between builds (when watching for changes), and has to read all external files from disk every time a change in one file is detected.

Install json-loader, brfs and transform-loader from NPM to make this work.