rt2zz / redux-persist

persist and rehydrate a redux store
MIT License
12.91k stars 862 forks source link

Uncaught TypeError: Cannot read properties of null (reading 'useContext') | persistStore | React 18 #1413

Open BlumDev92 opened 1 year ago

BlumDev92 commented 1 year ago

Current Behavior

nx run my-app:serve throws error: Uncaught TypeError: Cannot read properties of null (reading 'useContext') Error does not appear when I remove persistStore and PersistGate.

Expected Behavior

App should run without any errors

Steps to Reproduce

  1. Create NX workspace (I don't know if this error only exists with NX workspace)
  2. Create react app
  3. Add redux persist
  4. Add Provider and PersistGate to App
  5. Serve/build app

Environment

  "dependencies": {
    "@expo/metro-config": "0.3.22",
    "@reduxjs/toolkit": "1.8.4",
    "@types/object-hash": "^2.2.1",
    "@types/react-loadable": "^5.5.6",
    "antd": "^4.23.4",
    "array-move": "^4.0.0",
    "axios": "^0.24.0",
    "core-js": "^3.6.5",
    "dompurify": "^2.3.6",
    "expo": "46.0.10",
    "expo-splash-screen": "~0.16.2",
    "expo-status-bar": "~1.4.0",
    "html-react-parser": "^1.4.8",
    "i18next": "^21.10.0",
    "lodash": "^4.17.21",
    "object-hash": "^3.0.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-grid-layout": "^1.3.1",
    "react-i18next": "^11.18.6",
    "react-icons": "^4.3.1",
    "react-loadable": "^5.5.0",
    "react-native": "0.69.5",
    "react-native-svg": "12.3.0",
    "react-native-svg-transformer": "1.0.0",
    "react-native-web": "~0.18.7",
    "react-qr-code": "^2.0.7",
    "react-quill": "^2.0.0",
    "react-redux": "8.0.2",
    "react-router-dom": "6.4.1",
    "redux-persist": "^6.0.0",
    "regenerator-runtime": "0.13.7",
    "tslib": "^2.0.0"
  },
  "devDependencies": {
    "@nrwl/cli": "14.8.3",
    "@nrwl/cypress": "14.8.3",
    "@nrwl/detox": "14.8.3",
    "@nrwl/eslint-plugin-nx": "14.8.3",
    "@nrwl/expo": "^14.8.3",
    "@nrwl/jest": "14.8.3",
    "@nrwl/linter": "14.8.3",
    "@nrwl/nx-cloud": "14.7.0",
    "@nrwl/react": "14.8.3",
    "@nrwl/tao": "14.8.3",
    "@nrwl/web": "14.8.3",
    "@nrwl/workspace": "14.8.3",
    "@rtk-query/codegen-openapi": "^1.0.0",
    "@svgr/webpack": "^6.3.1",
    "@testing-library/jest-dom": "5.16.5",
    "@testing-library/jest-native": "4.0.11",
    "@testing-library/react": "12.1.2",
    "@testing-library/react-hooks": "7.0.2",
    "@testing-library/react-native": "11.0.0",
    "@types/dompurify": "^2.3.2",
    "@types/jest": "28.1.8",
    "@types/lodash": "^4.14.178",
    "@types/node": "18.7.18",
    "@types/react": "18.0.20",
    "@types/react-dom": "18.0.6",
    "@types/react-grid-layout": "^1.3.0",
    "@types/react-native": "0.69.8",
    "@types/redux-persist": "^4.3.1",
    "@typescript-eslint/eslint-plugin": "5.39.0",
    "@typescript-eslint/parser": "5.39.0",
    "babel-jest": "28.1.3",
    "babel-preset-expo": "~9.2.0",
    "cypress": "^9.1.0",
    "detox": "19.12.1",
    "eas-cli": "2.1.0",
    "eslint": "8.15.0",
    "eslint-config-prettier": "8.1.0",
    "eslint-plugin-cypress": "^2.10.3",
    "eslint-plugin-import": "2.26.0",
    "eslint-plugin-jsx-a11y": "6.6.1",
    "eslint-plugin-react": "7.31.8",
    "eslint-plugin-react-hooks": "4.6.0",
    "expo-cli": "6.0.5",
    "jest": "28.1.3",
    "jest-circus": "28.1.1",
    "jest-environment-jsdom": "28.1.1",
    "jest-expo": "46.0.1",
    "metro-resolver": "0.72.2",
    "prettier": "2.7.1",
    "react-test-renderer": "18.2.0",
    "release-it": "^15.2.0",
    "swagger-cli": "^4.0.4",
    "ts-jest": "28.0.8",
    "ts-node": "10.9.1",
    "typeconv": "^1.8.0",
    "typescript": "4.8.4"
  }

Node version: 16.13.0 npm version: 8.1.0

Is this related to React 18? Is somebody facing the same issue?