使用 Nuxt.js 加载 .mp3 文件

Question

我在使用 Nuxt.JS (Vue.js) 加载 .mp3 文件时遇到问题...

我尝试在没有特定加载器的情况下加载文件，webpack 告诉他需要一个特定的加载器来加载该文件，当我在 nuxt.config.js 文件中添加 url-loader 时：

 build: {
/*
** Run ESLint on save
*/
extend (config, { isDev, isClient }) {
  if (isDev && isClient) {
    config.module.rules.push({
      enforce: 'pre',
      test: /\.(js|vue)$/,
      loader: 'eslint-loader',
      exclude: /(node_modules)/
    })

    config.module.rules.push({
      test: /\.(ogg|mp3|wav)$/i,
      loader: 'url-loader'
    })

  }
}

抛出错误：

TypeError
Cannot read property 'middleware' of undefined

有人在 Nuxt.Js 中使用过其他加载器吗？

提前致谢！

Answer 1

来自Nuxt.js官方文档：https://nuxtjs.org/faq/webpack-audio-files/

export default {
  build: {
    extend (config, ctx) {
      config.module.rules.push({
        test: /\.(ogg|mp3|wav|mpe?g)$/i,
        loader: 'file-loader',
        options: {
          name: '[path][name].[ext]'
        }
      })
    }
  }
}