Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not working with RN 0.66? #22

Open
artstylee opened this issue Dec 22, 2021 · 8 comments
Open

Not working with RN 0.66? #22

artstylee opened this issue Dec 22, 2021 · 8 comments

Comments

@artstylee
Copy link

"react-native": "0.66.4",

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: motonative@0.0.1
npm ERR! Found: react-native@0.66.4
npm ERR! node_modules/react-native
npm ERR!   react-native@"0.66.4" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native@"0.64.2" from react-native-autoscroll-flatlist@1.11.0
npm ERR! node_modules/react-native-autoscroll-flatlist
npm ERR!   react-native-autoscroll-flatlist@"*" from the root project

and is it possible to add pagination on scroll top ?

@chubillkelvin
Copy link
Owner

Hi @artstylee the package has only been tested up to 0.64.2.

With the issue you indicated, let me work on the upgrade for the project!

Meanwhile, could you elaborate a little on what do you mean by pagination?

Correct me if I'm wrong, but I would suppose using the FlatList component's intention is to implement infinite scroll-like experience. This usually does not go together with pagination.

@artstylee
Copy link
Author

ye i mean infinite scroll... you can see it in chats like telegram or discord, when you reach the top of the flatlist, the old messages must be load

@chubillkelvin
Copy link
Owner

chubillkelvin commented Dec 22, 2021

@artstylee since this project extends from the official FlatList component, you should be able to implement infinite scroll normally.

I do not plan to implement this functionality into this project because there can be many different ways one can implement infinite scroll and there is no way I can easily accommodate all of them.

With that said, here is a repo I made earlier this year which might be a helpful reference for you to implement such functionality.

If you actually found a constraint from this library that stops you from implementing this feature, please do let me know. Thanks!

@chubillkelvin
Copy link
Owner

@artstylee I have just tried creating a brand-new app with react-native init using RN 0.66.

The app seems to work fine for me and I cannot reproduce the error you stated:

Screenshot 2021-12-22 at 9 00 05 PM

Maybe you should try removing the node_modules folder and try doing npm install or yarn install again?

If that does not work for you, can you please provide me with a minimum reproducible example so I can look into this issue?

Thank you!

@artstylee
Copy link
Author

artstylee commented Dec 22, 2021

reinstalled node_modules
still got the error

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: motonative@0.0.1
npm ERR! Found: react-native@0.66.4
npm ERR! node_modules/react-native
npm ERR!   react-native@"0.66.4" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native@"0.64.2" from react-native-autoscroll-flatlist@1.11.0
npm ERR! node_modules/react-native-autoscroll-flatlist
npm ERR!   react-native-autoscroll-flatlist@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\x4r7\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\x4r7\AppData\Local\npm-cache\_logs\2021-12-22T16_20_31_736Z-debug.log

eresolve-report.txt

# npm resolution error report

2021-12-22T16:20:31.727Z

While resolving: motonative@0.0.1
Found: react-native@0.66.4
node_modules/react-native
  react-native@"0.66.4" from the root project

Could not resolve dependency:
peer react-native@"0.64.2" from react-native-autoscroll-flatlist@1.11.0
node_modules/react-native-autoscroll-flatlist
  react-native-autoscroll-flatlist@"*" from the root project

Fix the upstream dependency conflict, or retry
this command with --force, or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.

Raw JSON explanation object:

{
  "code": "ERESOLVE",
  "current": {
    "name": "react-native",
    "version": "0.66.4",
    "whileInstalling": {
      "name": "motonative",
      "version": "0.0.1",
      "path": "D:\\docs\\proj\\react-express-jwt-full\\motoNative"
    },
    "location": "node_modules/react-native",
    "isWorkspace": false,
    "dependents": [
      {
        "type": "prod",
        "name": "react-native",
        "spec": "0.66.4",
        "from": {
          "location": "D:\\docs\\proj\\react-express-jwt-full\\motoNative"
        }
      }
    ]
  },
  "currentEdge": {
    "type": "prod",
    "name": "react-native",
    "spec": "0.66.4",
    "from": {
      "location": "D:\\docs\\proj\\react-express-jwt-full\\motoNative"
    }
  },
  "edge": {
    "type": "peer",
    "name": "react-native",
    "spec": "0.64.2",
    "error": "INVALID",
    "from": {
      "name": "react-native-autoscroll-flatlist",
      "version": "1.11.0",
      "whileInstalling": {
        "name": "motonative",
        "version": "0.0.1",
        "path": "D:\\docs\\proj\\react-express-jwt-full\\motoNative"
      },
      "location": "node_modules/react-native-autoscroll-flatlist",
      "isWorkspace": false,
      "dependents": [
        {
          "type": "prod",
          "name": "react-native-autoscroll-flatlist",
          "spec": "*",
          "from": {
            "location": "D:\\docs\\proj\\react-express-jwt-full\\motoNative"
          }
        }
      ]
    }
  },
  "strictPeerDeps": false,
  "force": false
}

=/ i can try to force it but that doesnt look like normal installation

package.json

  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.15.14",
    "@react-native-cookies/cookies": "^6.0.11",
    "@react-navigation/bottom-tabs": "^6.0.9",
    "@react-navigation/drawer": "^6.1.8",
    "@react-navigation/native": "^6.0.6",
    "@react-navigation/native-stack": "^6.2.5",
    "react": "17.0.2",
    "react-native": "0.66.4",
    "react-native-flipper": "^0.125.0",
    "react-native-gesture-handler": "^2.1.0",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-reanimated": "^2.3.1",
    "react-native-safe-area-context": "^3.3.2",
    "react-native-screens": "^3.10.1",
    "rn-flipper-async-storage-advanced": "^1.0.4",
    "socket.io-client": "^4.4.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/runtime": "^7.12.5",
    "@react-native-community/eslint-config": "^2.0.0",
    "babel-jest": "^26.6.3",
    "eslint": "7.14.0",
    "jest": "^26.6.3",
    "metro-react-native-babel-preset": "^0.66.2",
    "react-test-renderer": "17.0.2"
  },

@chubillkelvin
Copy link
Owner

@artstylee on a closer look, this seems to be an error due to new npm behavior. You can read more here.

In short, you can fix the error by doing npm install --legacy-peer-deps.

What does it do?

  • New npm version now installs peerDependencies by default (new behavior)
  • This creates conflicts because multiple versions of the same library are being installed
  • Using the --legacy-peer-deps flag will tell npm to go back to the older behavior (NOT to install peerDependencies) and it will solve the problem

Hope this helps!

@chubillkelvin
Copy link
Owner

@artstylee I have published v1.11.1 which has the peerDependencies updated. I hope this solves the problem for you.

If not, I would recommend you try the --legacy-peer-deps solution in the meantime.

@artstylee
Copy link
Author

artstylee commented Dec 23, 2021

@artstylee I have published v1.11.1 which has the peerDependencies updated. I hope this solves the problem for you.

If not, I would recommend you try the --legacy-peer-deps solution in the meantime.

the package from npm still fires an error
so i just did
npm install --save react-native-autoscroll-flatlist --legacy-peer-deps
thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants