Serving mp3 files as part of a npm package

Question

I created a NPM package that uses mp3 files, and plays them using howler.js.

When I install the package as a dependency on another project, I can't seem to play the files from the node_modules folder.

I have tried using babel alone and webpack with babel, file-loader, url-loader.

Code for requiring files

    const filePath = path.join(__dirname, 'dist/public/Media/' + note.instrument + '/' + 'FF_' + notes['b'][notes[note.lang].indexOf(note._note)] + note._octave + '.mp3')
    sounds.set(key, new Howl({
        src: [filePath]
    }))

webpack.config.js

const path = require('path')

module.exports = {
  entry: './src/index.js',
  mode: 'development',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  }
}

Error

Access to XMLHttpRequest at 'file:///dist/public/Media/Piano/FF_C1.mp3' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes

How can I bundle and resolve static assets for use in another project?

Answer 1

In case anyone is wondering, i eventually solved it by creating a Rest API that serves the files and fetching them when needed.