【问题标题】:`unable to resolve module @react-native-community/async-storage` broke down my React Native environment`unable to resolve module @react-native-community/async-storage` 破坏了我的 React Native 环境
【发布时间】:2019-12-06 11:59:03
【问题描述】:

我基本上遇到了和这里一样的问题。

https://github.com/firebase/firebase-js-sdk/issues/1899

我是怎么得到这个错误的

由于不推荐使用AsyncStorage,我尝试在official documentation 之后安装@react-native-community/async-storage

但它完全失败了,因为我得到了上面的错误。 因此,我想回滚到我以前的工作版本,但我所做的一切都不起作用。

这些都没有解决我的问题

  1. 错误屏幕上建议了 4 个命令
  2. yarn remove撤销yarn add
  3. 我也做了npm install @react-native-community/async-storage,没用。 3.5 所以我做了npm uninstall @react-native-community/async-storage 它被删除了,但是回滚不起作用。
  4. 重新安装react-native-cli
  5. 重新创建一个完整的new project from scratch,但仍然报同样的错误。

我找不到解决方案。请帮忙。

【问题讨论】:

    标签: react-native


    【解决方案1】:

    如果它在iOS 上,你可能忘记了pod install

    把这个粘贴到ios/Podfile:

      pod 'RNCAsyncStorage', :path => '../node_modules/@react-native-community/async-storage'
    

    那么就做cd ios && pod install

    编辑。

    我从头开始创建了一个项目,这是我为使 asyncStorage 在 iOS 和 Android 上运行所做的步骤:

    1) react-native init AsyncTest

    2)npm i @react-native-community/async-storage

    (在此步骤中尝试使用 asyncStorage 会显示错误,但适用于 Android)

    3) 将这个 pod 粘贴到 Podfile 中:

      pod 'RNCAsyncStorage', :path => '../node_modules/@react-native-community/async-storage'
    

    4) 从终端,​​假设您在项目文件夹中,请执行 cd iospod install

    5) 项目在 iOS 上成功运行并正常运行。

    react-native 版本是 0.60.4

    这就是项目测试 App.js 用于测试的方式:

    import React from 'react';
    import { View } from 'react-native';
    import AsyncStorageTest from './AsyncStorageTest'
    const App = () => {
      return (
        <View>
          <AsyncStorageTest />
        </View>
      );
    };
    
    export default App
    

    而 AsyncStorageTest 是:

    import React, { Component } from 'react'
    import { View, Text, Button } from 'react-native'
    import AsyncStorage from '@react-native-community/async-storage';
    
    export class AsyncStorageTest extends Component {
        constructor(props) {
            super(props)
            this.state = {
                storedData: "myValue"
            }
        }
    
    
    storeData = async () => {
        console.log("inside storeData")
        try {
            await AsyncStorage.setItem('Test', 'TestValue')
        } catch (e) {
            console.log(e)
        }
    }
    
    getData = async () => {
        console.log("inside getData")
        try {
            const value = await AsyncStorage.getItem('Test')
            this.setState({ storedData: value })
    
        } catch (e) {
            // error reading value
        }
    }
    
    render() {
        return (
            <View style={{ marginTop: 40 }}>
                <Text> {this.state.storedData}</Text>
                <Button title={"storeData"} onPress={this.storeData}></Button>
                <Button title={"getData"} onPress={this.getData}></Button>
            </View>
        )
    }
    }
    
    
    export default AsyncStorageTest
    

    经过测试和工作,看看你是否遗漏了什么。

    确保 @react-native-community/async-storage 与您的项目取消链接。

    【讨论】:

    • 让我试试这个。但是为什么我删除后它仍然无法使用?
    • 我没有注意到您尝试卸载它。也许您之后忘记更新您的代码?我正在使用 react-native 0.60,这是我必须采用的解决方案才能使其工作。我不知道您是否出于某种原因编辑了您的评论,但这是针对大于 0.60 的 react-native 版本,因为 iOS 使用 cocoapods 现在运行
    • 我不可能忘记更新我的代码,因为我从头开始重新创建了新项目。所以我应该最终得到 react native 提供的初始代码。
    • 我重新启动了我的电脑,它现在可以工作了……它给了我no bundle url 错误,我运行了 npm install,它现在可以工作了。我不知道为什么
    • 很奇怪,是的,很高兴你找到了解决方案!
    【解决方案2】:

    在我运行 npm install react-native-dotenv 之后 我接受这个错误,

    然后我重新运行 npm install; cd ios;pod install;cd ..;

    然后关闭终端并从手机上卸载应用程序,然后重新启动它们就可以了。

    我的版本“反应”:“16.9.0”, “反应原生”:“0.61.5”,

    【讨论】:

      【解决方案3】:

      对于像我这样的人,请仔细检查:

      当您安装npm i @react-native-community/async-storage 时,您应该将其导入为import AsyncStorage from '@react-native-community/async-storage';,并且不要导入为import AsyncStorage from '@react-native-async-storage/async-storage';

      【讨论】:

      • @Hylle 你并不孤单:D
      【解决方案4】:

      我通过安装别名为@react-native-async-storage/async-storage@react-native-community/async-storage 解决了这个问题

      命令是

      yarn add @react-native-async-storage/async-storage@npm:@react-native-community/async-storage

      npm install --save @react-native-async-storage/async-storage@npm:@react-native-community/async-storage

      【讨论】:

        【解决方案5】:

        不知何故,包的路径发生了变化。

        这对我有帮助:

        import AsyncStorage from '@react-native-async-storage/async-storage';
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2020-01-24
          • 1970-01-01
          • 2017-10-31
          • 1970-01-01
          • 1970-01-01
          • 2018-11-28
          • 1970-01-01
          相关资源
          最近更新 更多