keplergl / kepler.gl

Kepler.gl is a powerful open source geospatial analysis tool for large-scale data sets.
http://kepler.gl
MIT License
10.42k stars 1.75k forks source link

[Bug] kepler.gl-master\examples\ returns dependency errors #2577

Open echo292 opened 5 months ago

echo292 commented 5 months ago

Describe the bug The latest kepler.gl is returning the following errors. Strangely, I never installed react 18.3.1. I had this working last week. Not sure what changed in the latest kepler.gl.

PS c:\dev\kepler.gl-master\kepler.gl-master\examples\demo-app> npm install npm error code ERESOLVE npm error ERESOLVE unable to resolve dependency tree npm error npm error While resolving: undefined@undefined npm error Found: react@18.3.1 npm error node_modules/react npm error react@"^18.2.0" from the root project npm error npm error Could not resolve dependency: npm error peer react@"^16.4.1" from react-palm@1.3.1 npm error node_modules/react-palm npm error react-palm@"^1.1.2" from the root project npm error npm error Fix the upstream dependency conflict, or retry npm error this command with --force or --legacy-peer-deps npm error to accept an incorrect (and potentially broken) dependency resolution.

Running it with --force or --legacy-peer-deps returns the same errors

Node.js version :v18.18.2 Npm version: 10.8.1

PS c:\dev\kepler.gl-master\kepler.gl-master\examples\demo-app> npm list -g react C:\Users\name\AppData\Roaming\npm └── (empty)

PS c:\dev\kepler.gl-master\kepler.gl-master\examples\demo-app> npm list react
demo-app@ c:\dev\kepler.gl-master\kepler.gl-master\examples\demo-app └── (empty)

To Reproduce Steps to reproduce the behavior:

  1. Get latest kepler.gl from master branch
  2. Change directory to any of the example folders. For example --> kepler.gl/examples/demo-app/
  3. Run "npm install"
  4. See errors

Expected behavior Install kepler.gl correctly and "npm start" run correctly in chrome browser.

Desktop (please complete the following information):

IDE -VS Code [1.89.1 2024]

echo292 commented 5 months ago

Just one other note, my npm cache is clear.

echo292 commented 5 months ago

I'm now wondering if it's the latest version of npm causing this.

echo292 commented 5 months ago

bemilton, thank you for tag teaming on this issue. I'm glad to see I'm not alone with the issues.

No matter which flag I use to npm/yarn install the versions in the project package.json, it will always install React 18.3.1 with a cascading dependency issue.

Curious, which version of npm are you using?

echo292 commented 5 months ago

Looks like this is a repeat of the same issue reported here: https://github.com/keplergl/kepler.gl/issues/2549

echo292 commented 5 months ago

There are a few suggestions in issue #2549 however none of them worked for me. Does anyone know of a fix?

Devidian commented 5 months ago

Same issues here running on Win11, VS Code, WSL2 Debian. Tried yarn/npm in different versions. Yarn 4 reports: react is listed by your project with version 18.3.1 (p63559), which doesn't satisfy what react-copy-to-clipboard and other dependencies request (but they have non-overlapping ranges!).

-----EDIT----- Ok so i have tried to checkout some other tagged versions. 3 alpha 0 seems to install but cant compile. Even 2.5.5 cant compile:

ERROR in bundle.js from Terser Error: error:0308010C:digital envelope routines::unsupported

echo292 commented 5 months ago

I'm thinking the most common issues are related to outdated babel or webpack scripts.

I was able to get Kepler.gl 3.0 release running with React 18.3.1 and Redux 9.1.2 in a custom project. The only issue I'm troubleshooting now are some uncaught runtime errors using Draw On Map>Polygon tool and Draw On Map>Rectangle tool. In this instance I'm not using any webpack.config.js start scripts which is why I'm may be getting the errors. For now I'm using react-scripts. I think I need the webpack script to make sure it's doing the exports for Turf. I posted the errors at the very bottom.

The Kepler.gl documentation is very outdated.

For any other poor souls trying to get a Kepler.gl project running, see my steps below. Caveat, Draw On Map>Polygon tool and Draw On Map>Rectangle tool return an error. I'm working on a webpack.config.js now to do the exports to see if that will fix the issues.

One thing I haven't tried is to create the project with my steps below then dump any of the /examples projects in to see if it will run.

Setup commands:

npx create-react-app kepler-gl-app
cd kepler-gl-app

npm install ajv kepler.gl assert react-palm react-redux redux redux-thunk deck.gl

project.json

{
  "name": "kepler-gl-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@deck.gl/core": "^8.9.27",
    "@deck.gl/extensions": "^8.9.27",
    "@deck.gl/layers": "^8.9.27",
    "@deck.gl/mapbox": "^8.9.27",
    "@deck.gl/react": "^8.9.27",
    "@kepler.gl/actions": "^3.0.0",
    "@kepler.gl/components": "^3.0.0",
    "@kepler.gl/constants": "^3.0.0",
    "@kepler.gl/processors": "^3.0.0",
    "@kepler.gl/reducers": "^3.0.0",
    "@kepler.gl/styles": "^3.0.0",
    "@loaders.gl/polyfills": "^4.1.0-alpha.4",
    "@luma.gl/core": "^8.5.20",
    "@luma.gl/webgl": "^8.5.20",
    "@nebula.gl/edit-modes": "1.0.2",
    "@nebula.gl/editor": "1.0.2",
    "@nebula.gl/layers": "1.0.2",
    "@nebula.gl/overlays": "1.0.2",
    "@testing-library/jest-dom": "^5.17.0",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@turf/bbox-polygon": "^7.0.0",
    "@turf/rewind": "^7.0.0",
    "ajv": "^8.16.0",
    "assert": "^2.1.0",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-markdown": "^9.0.1",
    "react-palm": "^3.3.8",
    "react-redux": "^9.1.2",
    "react-scripts": "5.0.1",
    "react-virtualized": "^9.22.5",
    "react-vis": "^1.11.7",
    "redux": "^5.0.1",
    "redux-thunk": "^3.1.0",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@babel/core": "^7.0.0",
    "@babel/plugin-proposal-class-properties": "^7.3.0",
    "@babel/preset-env": "^7.0.0",
    "@babel/preset-react": "^7.0.0",
    "@babel/preset-typescript": "^7.16.7",
    "babel-loader": "^8.0.0",
    "webpack": "^4.29.0",
    "webpack-cli": "^3.2.1",
    "webpack-dev-middleware": "^3.5.1",
    "webpack-dev-server": "^4.15.1",
    "webpack-hot-middleware": "^2.24.3"
  }
}

Draw On Map>Polygon tool and Draw On Map>Rectangle tool return an error:

 Uncaught runtime errors:
    ×
    ERROR
    (0 , _rewind.default) is not a function
    TypeError: (0 , _rewind.default) is not a function
        at DrawPolygonMode.rewindPolygon (localhost:3000/static/js/bundle.js:155146:39)
        at DrawPolygonMode.getAddFeatureAction (localhost:3000/static/js/bundle.js:155160:32)
        at DrawPolygonMode.getAddFeatureOrBooleanPolygonAction (http://localhost:3000/static/js/bundle.js:155251:19)
        at DrawPolygonMode.handleClick (localhost:3000/static/js/bundle.js:153250:31)
        at EditableGeoJsonLayer.onLayerClick (localhost:3000/static/js/bundle.js:161248:28)
        at EditableGeoJsonLayer._onanyclick (localhost:3000/static/js/bundle.js:162032:12)
        at EditableGeoJsonLayer._forwardEventToCurrentLayer (http://localhost:3000/static/js/bundle.js:162022:7)
        at EventRegistrar._emit (localhost:3000/static/js/bundle.js:344192:9)
        at EventRegistrar.handleEvent (localhost:3000/static/js/bundle.js:344090:12)
        at Manager.emit (localhost:3000/static/js/bundle.js:311400:20)

``

    Uncaught runtime errors:
    ×
    ERROR
    (0 , _bboxPolygon.default) is not a function
    TypeError: (0 , _bboxPolygon.default) is not a function
        at DrawRectangleMode.getTwoClickPolygon (localhost:3000/static/js/bundle.js:199052:51)
        at DrawRectangleMode.getGuides (localhost:3000/static/js/bundle.js:205182:26)
        at DrawRectangleMode.getTentativeGuide (localhost:3000/static/js/bundle.js:200606:25)
        at DrawRectangleMode.checkAndFinishPolygon (localhost:3000/static/js/bundle.js:205147:35)
        at DrawRectangleMode.handleClick (localhost:3000/static/js/bundle.js:205121:12)
        at EditableGeoJsonLayer.onLayerClick (localhost:3000/static/js/bundle.js:206738:28)
        at EditableGeoJsonLayer._onanyclick (localhost:3000/static/js/bundle.js:207522:12)
        at EditableGeoJsonLayer._forwardEventToCurrentLayer (localhost:3000/static/js/bundle.js:207512:7)
        at EventRegistrar._emit (localhost:3000/static/js/bundle.js:320708:9)
        at EventRegistrar.handleEvent (localhost:3000/static/js/bundle.js:320606:12)
    ``
DButkovskyi commented 4 months ago

@echo292 do you mind sharing other setting such as node version, et? I am still getting errors while running your script

npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: kepler-gl-app@0.1.0
npm error Found: react@18.3.1
npm error node_modules/react
npm error   react@"^18.3.1" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react@"0.14.x - 16.x" from @nebula.gl/overlays@1.0.2
npm error node_modules/@nebula.gl/overlays
npm error   @nebula.gl/overlays@"1.0.2" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
echo292 commented 4 months ago

@DButkovskyi, after you create the React project, delete the package.lock file and copy my posted package.json. Then use yarn instead to do the installs. The only issue with this method, the install needs the correct loaders to create the bundle.js. Otherwise it will not generate the correct function signatures. For example, Draw On Map>Polygon tool and Draw On Map>Rectangle tool. See my errors in previous post. kepler.gl\webpack the scripts that create the bundle.js. I'm hoping to have some time soon to figure out a way around it. The Kepler.gl 3.0 release demo github clone doesn't work as per the documentation. Not sure how it past the test scripts.

pablos1rvent commented 4 months ago

Same here, it's impossible to install or build.

mars-dlx commented 2 months ago

Project build with Yarn. So, only the yarn.lock file is present. Most likely NPM can not build proper package-lock.json and fail. Try to use Yarn.

The full instruction can be found here. I believe most of it is still valid. At least it helps me to run the demo app.