公用文件夹的音效无法在部署中加载

Question

正如标题所示，我部署了我的站点，但它无法加载音效

回购：https://github.com/SyntaxWarrior30/Documentation-Wizard/tree/2bea2b4781933f29f773b4fec52a806c31bcec70

活动站点：https://syntaxwarrior30.github.io/Documentation-Wizard/

这就是我尝试从公用文件夹加载音效的方式，在

src/DocsGen.jsx

:

DocsGen.jsx
Line 30 | const successAudio = new Audio('/public/Success.wav');
Line 31 | const errorAudio = new Audio('/public/Error.wav');

我也试过：

DocsGen.jsx
Line 30 | const successAudio = new Audio('/Success.wav');
Line 31 | const errorAudio = new Audio('/Error.wav');

两者都在控制台中导致

Failed to load resource: the server responded with a status of 404 ()

Answer 1

Public文件夹是react中的一个特殊文件夹，不在react bundle的范围内。

要在公用文件夹中使用资产，您只需直接引用它们即可。

const successAudio = new Audio('/Success.wav');

const errorAudio = new Audio('/Error.wav');

这里有一个相关的线程：How to import and play all audio files from a directory in React?