react-native - 找不到模块:错误:无法解析“react-native/Libraries/Image/resolveAssetSource”
问题描述
我正在我当前的 react-native 项目中添加一个音频模块。我尝试安装几个模块(react-native-sound,react-native-track-player)。在两个模块中获取相同的错误输出,该输出始终指向“react-native/Libraries/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:\workspaces\web\react\blink\node_modules\react-native-track-player\lib'
@ ./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-native-track-player 的索引文件中的当前导入:
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 没有不为第三方提供这个特定的库,我不知道。
解决方案
这似乎是一个语法错误问题。没有文件或模块命名,模块和文件名都是大写的。resolveAsset
s
ource
resolveAsset
S
ource
S
尝试删除react-native-track-player
并yarn remove 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';
但这不是首选的方法,因为此方法是 RN Image
class/component的成员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);
无论哪种方式,您都可以使用该方法并解析资产来源信息。
推荐阅读
- python - 使用 asyncio/pyppeteer 时打开文件过多错误
- function - 为什么我的脚本中出现函数错误?
- entity-framework - 使用依赖注入时使用存储库模式的多个 DB 上下文与 UnitofWork
- reactjs - SVG 笔划未显示在 clipPath 内部
- mongodb - 配置 AuthenticationManagerBuilder 以使用用户存储库
- facebook - 在使用 Facebook 的 Oauth 和 Python Flask 作为后端服务时卡住了
- azure - 使用 Graph API 创建 Azure SSO 应用程序
- coldfusion - 带有 ColdFusion 的 reCaptcha v3
- javascript - 在同一页面上处理 AJAX 请求 - PHP
- android - Android Studio 是否支持所有 Kotlin 功能和 API?