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

[echo292]

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: [email protected] 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 [email protected] 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):

• OS: Windows 10 Pro [22H2]
• Browser [chrome 120.0.6099.291]

IDE -VS Code [1.89.1 2024]

[echo292]

Just one other note, my npm cache is clear.

[echo292]

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

[echo292]

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]

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

[echo292]

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

[Devidian]

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]

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]

@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: [email protected]
npm error Found: [email protected]
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/[email protected]
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]

@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]

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

[mars-dlx]

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.

[igorDykhta]

Demo-app/README.md is now up to date.

yarn install;
yarn bootstrap;
cd examples/demo-app;
yarn install;

No breaking changes. Closing.

[leimgruberf]

@igorDykhta I am still seeing this on 111b3180d2bb44ea230b2da3748801c955e8f2ef, a yarn install in the root gives:

➤ YN0000: · Yarn 4.4.0
➤ YN0000: ┌ Resolution step
➤ YN0000: └ Completed in 0s 494ms
➤ YN0000: ┌ Post-resolution validation
➤ YN0060: │ @loaders.gl/core is listed by your project with version 4.3.2 (pe6d1b), which doesn't satisfy what @deck.gl/geo-layers and other dependencies request (but they have non-overlapping ranges!).
➤ YN0060: │ eslint is listed by your project with version 8.53.0 (p14999), which doesn't satisfy what eslint-plugin-compat (via eslint-config-developit) and other dependencies request (^7.28.0).
➤ YN0060: │ react is listed by your project with version 18.3.1 (p0661a), which doesn't satisfy what react-hot-loader and other dependencies request (but they have non-overlapping ranges!).
➤ YN0060: │ react is listed by your project with version 18.3.1 (p6b28a), which doesn't satisfy what react-sortable-hoc and other dependencies request (but they have non-overlapping ranges!).
➤ YN0060: │ react-dom is listed by your project with version 18.3.1 (pd36df), which doesn't satisfy what react-hot-loader and other dependencies request (but they have non-overlapping ranges!).
➤ YN0060: │ react-dom is listed by your project with version 18.3.1 (pf49fa), which doesn't satisfy what react-sortable-hoc and other dependencies request (^16.8.0).
➤ YN0060: │ typedoc is listed by your project with version 0.19.2 (p8fc8c), which doesn't satisfy what typedoc-plugin-markdown requests (>=0.24.0).
➤ YN0060: │ typescript is listed by your project with version 4.7.2 (pacd39), which doesn't satisfy what typedoc and other dependencies request (~3.9.0 || ~3.9.0 || ~3.9.0 || ~3.9.0 || ~3.9.0 || ~3.9.0 || ~3.9.0 || ~3.9.0 || ~3.9.0 || ~4.0.0 || ~4.0.0 || ~4.0.0 || ~4.0.0 || ~4.0.0 || ~4.0.0 || ~4.0.0 || ~4.0.0 || ~4.0.0).
➤ YN0002: │ @kepler.gl/actions@workspace:src/actions doesn't provide enzyme (pac7e4), requested by react-palm.
➤ YN0002: │ @kepler.gl/actions@workspace:src/actions doesn't provide enzyme-adapter-utils (pa15d4), requested by react-palm.
➤ YN0002: │ @kepler.gl/actions@workspace:src/actions doesn't provide react (p34cd1), requested by @reduxjs/toolkit and other dependencies.
➤ YN0002: │ @kepler.gl/ai-assistant@workspace:src/ai-assistant doesn't provide @openassistant/common (p00600), requested by @openassistant/geoda.
➤ YN0002: │ @kepler.gl/ai-assistant@workspace:src/ai-assistant doesn't provide react (pe0a16), requested by @openassistant/core and other dependencies.
➤ YN0002: │ @kepler.gl/ai-assistant@workspace:src/ai-assistant doesn't provide react-dom (p8fdab), requested by @openassistant/echarts and other dependencies.
➤ YN0002: │ @kepler.gl/components@workspace:src/components doesn't provide @loaders.gl/core (p8dbec), requested by @loaders.gl/mvt and other dependencies.
➤ YN0002: │ @kepler.gl/constants@workspace:src/constants doesn't provide react (p26be4), requested by @dnd-kit/core and other dependencies.
➤ YN0002: │ @kepler.gl/constants@workspace:src/constants doesn't provide react-dom (p78583), requested by @dnd-kit/core.
➤ YN0002: │ @kepler.gl/deckgl-layers@workspace:src/deckgl-layers doesn't provide @deck.gl/extensions (p350b5), requested by @deck.gl/geo-layers.
➤ YN0002: │ @kepler.gl/deckgl-layers@workspace:src/deckgl-layers doesn't provide @deck.gl/mesh-layers (p97219), requested by @deck.gl/geo-layers.
➤ YN0002: │ @kepler.gl/deckgl-layers@workspace:src/deckgl-layers doesn't provide @loaders.gl/core (pc8425), requested by @deck.gl/geo-layers and other dependencies.
➤ YN0002: │ @kepler.gl/duckdb@workspace:src/duckdb doesn't provide react (pe1999), requested by @monaco-editor/react and other dependencies.
➤ YN0002: │ @kepler.gl/duckdb@workspace:src/duckdb doesn't provide react-dom (pf1d1a), requested by @monaco-editor/react and other dependencies.
➤ YN0002: │ @kepler.gl/layers@workspace:src/layers doesn't provide @deck.gl/aggregation-layers (pd0339), requested by @kepler.gl/deckgl-arrow-layers.
➤ YN0002: │ @kepler.gl/layers@workspace:src/layers doesn't provide @luma.gl/core (pbed8f), requested by @deck.gl/extensions and other dependencies.
➤ YN0002: │ @kepler.gl/layers@workspace:src/layers doesn't provide @math.gl/core (p8ec20), requested by @deck.gl/extensions.
➤ YN0002: │ @kepler.gl/layers@workspace:src/layers doesn't provide @math.gl/web-mercator (p2e0cc), requested by @deck.gl/extensions.
➤ YN0002: │ @kepler.gl/layers@workspace:src/layers doesn't provide @types/react (p4bb10), requested by react-markdown and other dependencies.
➤ YN0002: │ @kepler.gl/layers@workspace:src/layers doesn't provide gl-matrix (p400e3), requested by @deck.gl/extensions.
➤ YN0002: │ @kepler.gl/layers@workspace:src/layers doesn't provide react-dom (p356b0), requested by styled-components.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide @deck.gl/aggregation-layers (p85763), requested by @kepler.gl/deckgl-arrow-layers.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide @deck.gl/core (pd7e37), requested by @kepler.gl/deckgl-arrow-layers.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide @deck.gl/geo-layers (p8a7d0), requested by @kepler.gl/deckgl-arrow-layers.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide @deck.gl/layers (p4c797), requested by @kepler.gl/deckgl-arrow-layers.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide @dnd-kit/core (pf1985), requested by @dnd-kit/sortable.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide @loaders.gl/core (p30d9c), requested by @loaders.gl/loader-utils.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide enzyme (pd895f), requested by react-palm.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide enzyme-adapter-utils (pa8c70), requested by react-palm.
➤ YN0002: │ @kepler.gl/reducers@workspace:src/reducers doesn't provide react (p7d99c), requested by @dnd-kit/sortable and other dependencies.
➤ YN0002: │ @kepler.gl/schemas@workspace:src/schemas doesn't provide @loaders.gl/core (p96edb), requested by @loaders.gl/loader-utils.
➤ YN0002: │ @kepler.gl/styles@workspace:src/styles doesn't provide react (pb09df), requested by styled-components.
➤ YN0002: │ @kepler.gl/styles@workspace:src/styles doesn't provide react-dom (pabdb1), requested by styled-components.
➤ YN0002: │ @kepler.gl/table@workspace:src/table doesn't provide @loaders.gl/core (p5c3fa), requested by @loaders.gl/mvt and other dependencies.
➤ YN0002: │ @kepler.gl/table@workspace:src/table doesn't provide enzyme (p9c9c3), requested by react-palm.
➤ YN0002: │ @kepler.gl/table@workspace:src/table doesn't provide enzyme-adapter-utils (p487fb), requested by react-palm.
➤ YN0002: │ @kepler.gl/table@workspace:src/table doesn't provide react (p0cfbf), requested by react-palm.
➤ YN0002: │ @kepler.gl/tasks@workspace:src/tasks doesn't provide enzyme (pd9938), requested by react-palm.
➤ YN0002: │ @kepler.gl/tasks@workspace:src/tasks doesn't provide enzyme-adapter-utils (pbee81), requested by react-palm.
➤ YN0002: │ @kepler.gl/tasks@workspace:src/tasks doesn't provide react (p83095), requested by react-palm.
➤ YN0002: │ @kepler.gl/utils@workspace:src/utils doesn't provide @dnd-kit/core (pbd708), requested by @dnd-kit/sortable.
➤ YN0002: │ @kepler.gl/utils@workspace:src/utils doesn't provide @loaders.gl/core (p36475), requested by @loaders.gl/arrow.
➤ YN0002: │ @kepler.gl/utils@workspace:src/utils doesn't provide react-dom (p6dee9), requested by react-map-gl.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @deck.gl/core (p2c302), requested by @deck.gl/mapbox and other dependencies.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @deck.gl/extensions (pc310f), requested by @nebula.gl/layers.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @deck.gl/geo-layers (p77e7d), requested by @nebula.gl/layers.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @deck.gl/layers (pd4400), requested by @nebula.gl/layers.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @deck.gl/mesh-layers (p2c019), requested by @nebula.gl/layers.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @deck.gl/react (p284bb), requested by @hubble.gl/react.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @loaders.gl/core (p11a39), requested by @hubble.gl/react and other dependencies.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @luma.gl/constants (p8e832), requested by @nebula.gl/layers.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @luma.gl/core (paf6bf), requested by @hubble.gl/core and other dependencies.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @luma.gl/debug (pe4b04), requested by @luma.gl/test-utils.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @luma.gl/engine (p09b31), requested by @hubble.gl/core.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @luma.gl/gltools (p873b0), requested by @luma.gl/test-utils.
➤ YN0002: │ kepler.gl@workspace:. doesn't provide @luma.gl/webgl (pc5cfe), requested by @deck.gl/test-utils and other dependencies.
➤ YN0086: │ Some peer dependencies are incorrectly met by your project; run yarn explain peer-requirements <hash> for details, where <hash> is the six-letter p-prefixed code.
➤ YN0086: │ Some peer dependencies are incorrectly met by dependencies; run yarn explain peer-requirements for details.
➤ YN0000: └ Completed
➤ YN0000: ┌ Fetch step
➤ YN0000: └ Completed in 1s 964ms
➤ YN0000: ┌ Link step
➤ YN0000: └ Completed in 1s 14ms
➤ YN0000: · Done with warnings in 3s 807ms