reaviz / reagraph

🕸 WebGL Graph Visualizations for React. Maintained by @goodcodeus.
https://reagraph.dev
Apache License 2.0
660 stars 64 forks source link

[NextJS] TypeError: keys is not a function #241

Open traitran44 opened 4 months ago

traitran44 commented 4 months ago

Describe the bug

Unable to integrate into NextJS, Error, TypeError: keys is not a function at file:///home/user/project/nextjs/ui/node_modules/reakeys/dist/index.js:4:31 at ModuleJob.run (node:internal/modules/esm/module_job:194:25) {

image

following is my package.json

{
  "name": "platform-ui",
  "version": "0.1.1",
  "private": true,
  "scripts": {
    "lint": "next lint",
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "export": "next export",
    "serve": "npm run build && firebase emulators:start --only hosting",
    "shell": "npm run build && firebase functions:shell",
    "deploy": "firebase deploy --only hosting",
    "logs": "firebase functions:log"
  },
  "overrides": {
    "react-json-view": {
      "react": "$react",
      "react-dom": "$react-dom"
    }
  },
  "dependencies": {
    "@emotion/react": "^11.11.4",
    "@emotion/styled": "^11.11.5",
    "@fontsource/roboto": "^5.0.8",
    "@fontsource/source-sans-pro": "^5.0.8",
    "@loadable/component": "^5.16.3",
    "@mui/icons-material": "5.15.13",
    "@mui/material": "5.15.13",
    "@mui/x-data-grid": "6.19.11",
    "@mui/x-data-grid-premium": "6.19.11",
    "@mui/x-date-pickers": "6.19.9",
    "@tanstack/query-core": "^5.17.7",
    "@textea/json-viewer": "^3.4.0",
    "@types/webgl2": "^0.0.11",
    "ag-grid-community": "^31.1.1",
    "ag-grid-enterprise": "^31.1.1",
    "ag-grid-react": "^31.1.1",
    "axios": "^1.5.1",
    "axios-cache-interceptor": "^1.5.1",
    "bignumber.js": "^9.1.2",
    "chart.js": "^4.4.0",
    "crypto-js": "^4.2.0",
    "dirty-json": "^0.9.2",
    "ethers": "^6.8.0",
    "firebase": "^10.5.0",
    "graphology-layout": "^0.6.1",
    "graphology-traversal": "^0.3.1",
    "html2canvas": "^1.4.1",
    "jsonrepair": "^3.6.0",
    "lightweight-charts": "^4.1.3",
    "lodash": "^4.17.21",
    "moment": "^2.29.4",
    "mustache": "^4.2.0",
    "next": "^14.2.3",
    "obliterator": "^2.0.4",
    "react": "^18.2.0",
    "react-chartjs-2": "^5.2.0",
    "react-dom": "^18.2.0",
    "react-hotkeys-hook": "^4.4.1",
    "react-json-view": "^1.21.3",
    "react-simple-typewriter": "^5.0.1",
    "reactflow": "^11.11.0",
    "reagraph": "^4.17.4",
    "recharts": "^2.12.2",
    "rxjs": "^7.8.1",
    "scichart": "^3.3.577",
    "scichart-example-dependencies": "^0.1.7",
    "scichart-react": "^0.1.8",
    "uuid": "^9.0.1",
    "versions": "^12.0.1",
    "viem": "^1.21.4",
    "ws": "^8.14.2"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "copy-webpack-plugin": "^12.0.2",
    "eslint": "^8",
    "eslint-config-next": "^14.2.3",
    "typescript": "^5",
    "worker-loader": "^3.0.8"
  }
}

tsconfig

{
  "compilerOptions": {
    "types": [],
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": [
        "./*"
      ]
    },
    "strictNullChecks": false
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    ".next/types/**/*.ts",
  ],
  "exclude": [
    "node_modules"
  ],
}

Steps to Reproduce the Bug or Issue

  1. Build NextJS project version ^14.2.3
  2. npm install reagraph and using my package.json
  3. npm run dev to serve in dev environment

Expected behavior

There should not be any error with NextJS

Screenshots or Videos

No response

Platform

Your Example Website or App

No response

Additional context

No response

jaroslaw-weber commented 4 months ago

same issue... also nextjs

joris-zwering commented 4 months ago

Any update?

SerhiiTsybulskyi commented 4 months ago

I've tried to reproduce it but it works for me. Here is Sandbox If you still have the issue please prepare an example to reproduce it