如何在React Native中要求()声音文件?

vdzxcuhz  于 2023-01-27  发布在  React
关注(0)|答案(4)|浏览(141)

我使用https://github.com/zmxv/react-native-sound在iOS(和Android)应用上播放声音,并尝试通过React Native的资产系统包含声音文件,但当我调用:
var sound = require('./sound.mp3');
我得到错误:
无法从[project ]/index. ios. js中解析模块./sound.mp3:无效目录[项目]/sound.mp3
我的MP3文件在我的项目的正确(根)目录中,与错误打印的文件路径完全相同。我也尝试过将它放在其他目录中。
根据这个线程,听起来声音文件也应该能够使用require()打包?
只是做一个测试,要求图像工作完美:var image = require('./image.png');

r7s23pms

r7s23pms1#

对我有效的方法是简单地使用应用程序名称作为根:

import myMP3File from '<appname>/assets/mymp3.mp3';
const Sound = require('react-native-sound');
Sound.setCategory('Playback');

// Do whatever you like with it.
Sound(myMP3File, () => console.log('soundfile loaded!'));

编辑:
我们现在使用rn-fetch-blob和以下解决方案来访问本地文件:

import RNFetchBlob from 'rn-fetch-blob';
const { fs } = RNFetchBlob;
filePathIos = `${fs.dirs.MainBundleDir}/yourFolder/yourMp3.mp3`;
filePathAndroid = fs.asset('yourFolder/yourMp3.mp3');

然后可以使用fs.cp()将相应的路径用于复制文件。

mqkwyuun

mqkwyuun2#

唯一有效的方法是将应用附带的音频文件放在assets目录下,然后让Xcode在构建时将这些文件复制到应用包中,此时,您可以使用react-native-fs之类的方法计算文件的完整路径,并将其提供给react-native-sound。

3df52oht

3df52oht3#

我在尝试播放sound.ogg时遇到了与托管Expo相同的错误信息。我所能找到的技巧都不起作用。最终,解决这个问题的方法是将ogg文件转换为Expo支持的mp3

ee7vknir

ee7vknir4#

您需要使用react-native-asset将文件放到项目中,并使用require关键字访问它们。
路径为./assets/audio/some-audio.mp3的文件示例:
1.添加或修改react-native.config.js

module.exports = {
 project: {
   ios: {},
   android: {},
 },
 dependencies: {
 },
 assets: [
   './assets/audio'
 ],
};

1.运行npx react-native-asset
1.使用以下文件:

const someAudio = require('./assets/audio/some-audio.mp3')

相关问题