在 Web 平台上使用异步存储运行 React Native 项目时出错

Question

我正在尝试在 Web 平台上运行 React Native 测试应用程序。
我已经安装了@react-native-community/async-storage依赖项。
它生成以下错误：

./node_modules/@react-native-community/async-storage/lib/AsyncStorage.js 中的错误 40:5 模块解析失败：意外令牌 (40:5) 您可能需要适当的加载程序来处理此文件类型。 | } | 类型 ReadOnlyArrayString = $ReadOnlyArray; | | 类型 MultiGetCallbackFunction = ( @ ./node_modules/@react-native-community/async-storage/lib/index.js 5:0-42 7:15-27 @ ./src/app.js @ ./index.web. js @ multi (webpack)-dev-server/client? http://0.0.0.0:8080 (webpack)/hot/dev-server.js ./index.web.js

./node_modules/@react-native-community/async-storage/lib/hooks.js 中的错误 7:5 模块解析失败：意外令牌 (7:5) 您可能需要适当的加载程序来处理此文件类型。 | 从'./AsyncStorage'导入AsyncStorage； | 类型 AsyncStorageHook = { | getItem: ( | callback?: ?(error: ?Error, result: string | null) => void, @ ./node_modules/@react-native-community/async-storage/lib/index.js 8:0-40 8:0-40 @ ./src/app.js @ ./index.web.js @ multi (webpack)-dev-server/client? http://0.0.0.0:8080 (webpack)/hot/dev- server.js ./index.web.js

注意：代码在 Android 上运行，但不在 Web 上运行。

Answer 1

resolve: {
    alias: {
        '@react-native-community/async-storage': 'react-native-web'
    }
}

在 webpack.config.json 中创建解析别名。

这可能会帮助你