小编KsK*_*KsK的帖子

更新问题在于我对我正在处理的环境缺乏了解，但下面给出的答案应该对其他有类似问题的人有用。

编辑：似乎问题在于尝试将我的 mp3 导入到我的 React 应用程序/组件时发生了一些奇怪的事情。当前的问题是，当我尝试使用时：

import soundfile from "../neure-resources/test.mp3"

我最终得到一个错误：

“找不到模块“../neure-resources/test.mp3”

为组件的任何其他导入解决此问题将确保正在导入的组件也已定义为可导出，但如何对 MP3 文件执行此操作？

因此，首先我不确定我的问题是否与导入/链接我的 mp3 文件有关，或者与如何在 React（或其他东西）中播放音频剪辑有关。一旦我们弄清楚我的问题究竟是什么，我将编辑标题。

所以我有一个应用程序，我在网页上有一个按钮，用户可以按下它来播放 mp3 文件。简单的东西，但我经常遇到以下错误：

HTTP 加载失败，状态为 404。媒体资源“...”加载失败。

现在虽然我不是非常精通文件路径等。我会通过查看指南和示例来弄清楚我可以弄清楚，但我一直无法做到。

我的缩写文件结构类似于（查看帖子底部以获得更详细的描述）：

学生/源代码/组件

在组件下，我将实际应用程序放在一个文件夹中，并将另一个文件夹放在我计划存储“资源”的组件下，因此：

组件/我的应用程序文件夹/我的实际应用程序.tsx

组件/我的资源/my.mp3

对于我理解的文件路径

“..”

表示路径从当前位置上方的一个文件夹开始，这将是我的

"/components" - 文件夹

我的资源文件夹在组件文件夹下，所以我认为应该没问题。我查了一些其他关于在 React 中播放音频的 SO 问题，发现了一个大致建议如下的问题：

在我的里面

render()

let path = "../my-resources/test.mp3";
let audio = new Audio(path);

然后对于 JSX 部分：

audioPlayer = (
            <div className="count-number-equivelance-audioPlayer">
                <button id="equivalence-audio-button" onClick={() => audio.play()}>Soundclip!</button>
            </div>
        ); 

我试过了：

let path = "../my-resources/test.mp3";

和

let path = "../../my-resources/test.mp3"; …