找不到模块：错误：无法解析"反应本机/库/图像/解析资产源"

Question

我正在我当前的react原生项目中添加一个音频模块。我试着安装了几个模块(react原生声音，react原生音轨播放器)。在两个模块中获取相同的错误输出，该错误输出始终指向"活动/库/Image/resolveAssetsource">，因为找不到模块。

ERROR in ./node_modules/react-native-track-player/lib/index.js
Module not found: Error: Can't resolve 'react-native/Libraries/Image/resolveAssetsource' in 'D:workspaceswebreactblinknode_modulesreact-native-track-playerlib'
@ ./node_modules/react-native-track-player/lib/index.js 1:401-459
@ ./node_modules/react-native-track-player/index.js
@ ./components/ui/BlinkAudio/BlinkAudio.web.js
@ ./components/ui/BlinkAudio/index.web.js
@ ./components/dialogs/ResourceDetails/ResourceDetails.js
@ ./components/dialogs/ResourceDetails/index.js
@ ./components/panels/catalog/CatalogPanel.js
@ ./components/parts/Main/Main.js
@ ./components/parts/Main/index.js
@ ./index.web.js

这是音频模块react原生音轨播放器的索引文件中的当前导入：

import { Platform, AppRegistry, DeviceEventEmitter, NativeEventEmitter, NativeModules } from 'react-native';
import resolveAssetSource from 'react-native/Libraries/Image/resolveAssetsource';

我已经尝试修复这个问题，包括从"react native"的导入中的"resolveAssetsource"，如下所示：

import { 
Platform, 
AppRegistry, 
DeviceEventEmitter, 
NativeEventEmitter, 
NativeModules, 
resolveAssetsource 
} from 'react-native';

但我不太确定这是否是最好的方式，通常我不喜欢直接接触包节点模块。

我还试图从webpack加载程序中排除音频模块，但没有结果。

module: {
loaders: [
{
test: /.js?$/,
exclude: function (modulePath) {
return (
/node_modules/.test(modulePath) &&
!/node_modules(\|/)react-native-track-player/.test(modulePath)
);
},

我想知道是否有人能帮我找到答案，以及是否有可能处理这个react native问题，因为我认为这些音频模块错误地调用了resolveAssetsource，或者另一方面，react native.我不知道它没有为第三方提供这个特定的库。

Answer 1

这似乎是一个语法错误问题。没有名为resolveAssetsource的文件或模块，模块和文件名为resolveAssetSource，大写为S。

尝试用yarn remove react-native-track-player删除react-native-track-player并重新安装(或删除整个node_modules目录并再次运行yarn install)，因为react-native-track-player/lib/index.js下的源代码正确无误：

import { Platform, AppRegistry, DeviceEventEmitter, NativeEventEmitter, NativeModules } from 'react-native';
import resolveAssetSource from 'react-native/Libraries/Image/resolveAssetSource';

如果你在其他地方使用它，你必须像这样导入：

import resolveAssetSource from 'react-native/Libraries/Image/resolveAssetSource';

但这不是首选的方法，因为此方法是RNImage类/组件Image.resolveAssetSource(source)的成员，因此，最好只导入Image组件并这样使用：

import { 
Platform, 
AppRegistry, 
DeviceEventEmitter, 
NativeEventEmitter, 
NativeModules, 
Image  // Add Image import
} from 'react-native';
// and use the function as of Image method
let audioAssetSource = Image.resolveAssetSource(audioSource);

无论哪种方式，您都可以使用该方法并解析资产源信息。