Async-storage: Warning: AsyncStorage has been extracted from react-native core

[michaelsinatra]

Current behavior

After having switched to React Native Community Async Storage via

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

and having updated its usage using

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

I still get the yellow box saying that "AsyncStorage has been extracted from react-native core and will be removed in a future release". This happens on both iOS and Android

Expected behavior

The yellow box shouldn't appear

Repro steps

1. Adding @react-native-community/async-storage using yarn
2. Importing it and running the application

Environment

• Async Storage version: 1.2.4
• React-Native version: 0.59.4
• Platform tested: iOS and Android

[michaelsinatra]

@Krizzu thanks for the update.

I upgraded to version 1.3.0, rebuilt the app from both the IDEs and the error doesn't go away.

[Krizzu]

Hey @michaelsinatra

Can you try to remove node_modules, install them again and restart the packager?

thanks.

[michaelsinatra]

@Krizzu thanks for your prompt response. I did that, but unfortunately it didn't seem to work. Also run yarn start -- --resetCache with the same result.

[Krizzu]

@michaelsinatra Right, this looks like you're still using v1.2.4.

Can you check what version you have inside your node_modules/@react-native-community/async-storage/package.json ? Might be that .lock file force installs old version.

thanks.

[michaelsinatra]

@Krizzu my node_modules/@react-native-community/async-storage/package.json is

{
  "name": "@react-native-community/async-storage",
  "version": "1.3.0",
  "description": "Asynchronous, persistent, key-value storage system for React Native.",
  "types": "./types/index.d.ts",
  "main": "lib/index.js",
  "author": "Krzysztof Borowy <[email protected]>",
  "contributors": [],
  "homepage": "https://github.com/react-native-community/react-native-async-storage#readme",
  "license": "MIT",
  "keywords": [
    "react-native",
    "react native",
    "async storage",
    "asyncstorage",
    "storage"
  ],
  "repository": {
    "type": "git",
    "url": "https://github.com/react-native-community/react-native-async-storage.git"
  },
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "start:android": "react-native run-android --root example/",
    "start:ios": "react-native run-ios --project-path example/ios",
    "build:e2e:ios": "detox build -c ios",
    "build:e2e:android": "detox build -c android",
    "test": "yarn test:lint && yarn test:flow",
    "test:flow": "flow check",
    "test:lint": "eslint 'lib/**/*.js' 'example/**/*.js'",
    "test:e2e:ios": "detox test -c ios",
    "test:e2e:android": "detox test -c android",
    "ci:publish": "yarn semantic-release"
  },
  "peerDependencies": {
    "react": "^16.0",
    "react-native": "^0.57.0"
  },
  "devDependencies": {
    "@babel/core": "7.0.0",
    "@react-native-community/eslint-config": "0.0.2",
    "@semantic-release/git": "7.0.8",
    "babel-core": "7.0.0-bridge.0",
    "babel-jest": "24.1.0",
    "babel-plugin-module-resolver": "3.1.3",
    "detox": "10.0.7",
    "eslint": "5.1.0",
    "flow-bin": "0.86.0",
    "jest": "24.1.0",
    "metro-react-native-babel-preset": "0.51.1",
    "react": "16.6.3",
    "react-native": "0.58.4",
    "react-test-renderer": "16.6.3",
    "semantic-release": "15.13.3"
  },
  "jest": {
    "preset": "react-native",
    "setupFiles": [
      "./example/jest.setup.js"
    ]
  },
  "detox": {
    "test-runner": "jest",
    "runner-config": "example/e2e/config.json",
    "configurations": {
      "ios": {
        "binaryPath": "example/ios/build/Build/Products/Release-iphonesimulator/AsyncStorageExample.app",
        "build": ".circleci/scripts/run_ios_e2e.sh \"iPhone X\"",
        "type": "ios.simulator",
        "name": "iPhone X"
      },
      "android": {
        "binaryPath": "example/android/app/build/outputs/apk/release/app-release.apk",
        "build": ".circleci/scripts/run_android_e2e.sh",
        "type": "android.emulator",
        "name": "Emu_E2E"
      }
    }
  }
}

Whilst my app yarn.lock is

"@react-native-community/async-storage@^1.3.0":
  version "1.3.0"
  resolved "https://registry.yarnpkg.com/@react-native-community/async-storage/-/async-storage-1.3.0.tgz#8254db63d6e2c51574008cce1535447055387b6a"
  integrity sha512-6nRSNDz8LpN3SXKkDNBXdpsxPt99c3B6hG2YeHoo63KdsEMszvi4JO5vHQVcmyzTE0YNb2whxeieox9uSDYRdg==

Thank you for investigating in this

[Krizzu]

@michaelsinatra Okay, this looks correct.

I initialized new project and added v1.3.0, no warnings on both platforms.

The only thing left to test out is to run react-native run-ios/react-native run-android to get the latest changes on native side.

Let me know how did it go.

[michaelsinatra]

@Krizzu I tried with the react-native run-* but the result is the same. That seems really odd. There is something I can log out that could be helpful in letting you know which version of AsyncStorage (RN's one or Community one) is being used?

Thank you

[Krizzu]

@michaelsinatra

This is odd.
Would it be much trouble for ya to test it on fresh project?

Steps to get started:

react-native init newproject
cd newproject
react-native add @react-native-community/async-storage
react-native link @react-native-community/async-storage

Then, modify App.js to use Community's AS.

Let me know if it's doable for ya.

[michaelsinatra]

@Krizzu tried it and it's working fine.

It seems that this happens on apps that were using the old AsyncStorage and then switch to the new one

[Krizzu]

We had an issue with v1.2.3 and v1.2.4 where iOS platform was actually using RN's Async Storage, but that is fixed in v1.3.0.

Is your project in external repo? What about deleting everything locally and pulling again? Did you try running your app on different simulators/devices?

[michaelsinatra]

Did all of the above, but without much luck. It seems deterministic

[Krizzu]

@michaelsinatra

Maybe you're importing Async Storage from react-native instead (somewhere in your code), hence the warning?

[michaelsinatra]

I just removed AsyncStorage from my app and the error still persists. At this point I believe it's one of the dependencies. I'll investigate further and report back

[Krizzu]

@michaelsinatra Got it.

I'm going to wait for your response before closing this issue.

thanks.

[michaelsinatra]

I'm closing the issue as I found that react-native-clcasher is using this line

import { AsyncStorage, Platform } from 'react-native';

Thank you for your support

[Krizzu]

No problem, great work finding it 👏

[betoharres]

I was getting the same issue then I found out that storybook also uses the old version:

    "@storybook/react-native": "^5.0.11",

removing the library removes the warning

[pkhodaveissi]

I see this even though I have 1.4.2 and I tried to find any other imports from node_modules which still use react-native but no luck

[msqar]

Wait, so if a 3rd party lib is using this old AS, i don't want to remove that lib at all, so any other workaround? Mmmm i will check, i guess i will have to post on the lib git so they can update it.

[PMExtra]

How to find which lib package that used the old AS?

[PMExtra]

I got it, reactotron-react-native used the old AS.

[lazarofl]

Maybe some old package versions are using AsyncStorage.
If it's possible, remove your 'package-lock.json' or 'yarn.lock' and run yarn to force some libs to be on latest stable version, or just check if all your packages are on latest stable version.
It works to me 👍

[gilsonoliveiraj]

I got it, reactotron-react-native used the old AS.

Once you find the package which is outdated, how to get rid of the message? Some libs are still required by the project.

[PMExtra]

I got it, reactotron-react-native used the old AS.

Once you find the package which is outdated, how to get rid of the message? Some libs are still required by the project.

Just search sth like import (.*)AsyncStorage(.*) from ['"]react-native['"] in your node_modules path.