[Question] How to bundle Howler?

[ludgerey]

Loading Howler asynchronously does not work for me.

How can I bundle Howler as a normal dependency like every other library too and ship it with my code?

[joshwcomeau]

"Does not work for me" is not actionable. Please provide a reproducible test case if you believe you're running into a bug, I'll be happy to take a look at it (though it might take me a while)

The library is designed to load the library async since it's a pretty hefty dependency and it's generally not worth it for a few sound effects. Not in the main usecase this library is built for.

[miracle2k]

Maybe @ludgerey meant to say that for his use case, loading howler is not the right approach.

You might look into doing a simple import 'howler' in your app code. I would hope that webpack is then smart enough to make a dynamic import('howler') as used by the library a no-op.

[ludgerey]

In my case it was a deployment issue. I use Laravel Vapor which deploys assets (like JS) to a CDN. The dynamic loading of the missing module resulted in a 404.

I had to change the webpack.mix.js accordingly:

const mix = require('laravel-mix');
const ASSET_URL = process.env.ASSET_URL ? process.env.ASSET_URL + "/" : "/";

// [...]

mix.webpackConfig(webpack => ({
    output: {
        publicPath: ASSET_URL
    },
    plugins: [
        new webpack.DefinePlugin({
            "process.env.ASSET_PATH": JSON.stringify(ASSET_URL)
        })
    ]
}));

With this configuration it works with Laravel Vapor.

[ludgerey]

The size of the library was no issue for me, because it was small in comparison to the rest and speed is not important in my case.