Question

（See fiddle 从webpack vue-cli sampple分发）

为什么图像资产被webpack成功捆绑，但音频资产不是？（我使用的是从vue-cli webpack项目派生的项目）

写作时

<img src="../assets/logo.png"></img>
<audio src="../assets/ding.ogg" type="audio/ogg"></audio>

徽标渲染得很好，但我得到了ding.ogg音频文件的404。

Answer 1

默认情况下，vue-loader不会处理带有 src 属性的音频标记：

要添加更多标记+属性，您可以在vue-loader的选项中使用 transformToRequire 值：

{
    test: /\.vue$/,
    loader: 'vue-loader',
    options: {
        // other options...
        transformToRequire: {
            "audio": "src"
        }
    }
}

Answer 2

如果有人像我几天前那样被卡在上面。我的解决办法是

{
    test: /\.vue$/,
    loader: 'vue-loader',
    options: {
        transformAssetUrls: {
          // other options...
          audio: 'src'
        }
    }
}

查看有关transformAssetUrls-https://vue-loader.vuejs.org/options.html#transformasseturls

的更多详细信息

在Vue / Webpack中找不到音频资产

2 个答案: