Search code examples
audiovue.jsvue-loader

Mp3 files and Vue-loader


I'm tying to load a mp3 file in my Vue component: (I'm using the Vue-CLI boilerplate)

const sound = new Audio(require("./sound.mp3")))

But I'm getting this error:

Unexpected character ‘’ (1:3) You may need an appropriate loader to handle this file type.

Here is a minimal project demonstrating the error: https://github.com/life4ants/vue-audio-test


Solution

  • adding the following to build/webpack.base.conf.js fixed the problem:

      {
        test: /\.mp3$/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: utils.assetsPath('img/[name].[hash:7].[ext]')
        }
      },
    

    the app at the above link has been updated and now works.