Compiled with problems: @deck.gl-community/editable-layers

[knejadshamsi]

Hello,
I encountered multiple "module not found" errors when following the "Get Started" guide for using the @deck.gl-community/editable-layers package in my project which consist of the following dependencies:

{
    "react": "18",
    "react-dom": "18",
    "react-map-gl": "^7.1.7",
    "mapbox-gl": "^3.5.2",
    "deck.gl": "^9.0.25",
    "@deck.gl-community/editable-layers": "^9.0.2",
    "@deck.gl-community/react": "^9.0.1",
    "@deck.gl/core": "^8.8.23",
}

It appears that the package called react-editable-layers is missing from yarn. And several dependencies or has incorrect paths in its internal imports. Below is a detailed description of the errors I'm encountering.

ERROR
Cannot find module './lib/style'
webpackMissingModule@http://localhost:3000/static/js/bundle.js:146100:50
./node_modules/@deck.gl-community/editable-layers/dist/index.js@http://localhost:3000/static/js/bundle.js:146100:136
options.factory@http://localhost:3000/static/js/bundle.js:146971:31
__webpack_require__@http://localhost:3000/static/js/bundle.js:146355:32
fn@http://localhost:3000/static/js/bundle.js:146629:21
./src/App.js@http://localhost:3000/static/js/bundle.js:24:111
options.factory@http://localhost:3000/static/js/bundle.js:146971:31
__webpack_require__@http://localhost:3000/static/js/bundle.js:146355:32
fn@http://localhost:3000/static/js/bundle.js:146629:21
./src/index.js@http://localhost:3000/static/js/bundle.js:2261:81
options.factory@http://localhost:3000/static/js/bundle.js:146971:31
__webpack_require__@http://localhost:3000/static/js/bundle.js:146355:32
@http://localhost:3000/static/js/bundle.js:147617:56
@http://localhost:3000/static/js/bundle.js:147619:12

ERROR in ./src/App.js 52:22-42
export 'EditableGeoJsonLayer' (imported as 'EditableGeoJsonLayer') was not found in '@deck.gl-community/editable-layers' (module has no exports)
ERROR in ./src/App.js 55:43-58
export 'DrawPolygonMode' (imported as 'DrawPolygonMode') was not found in '@deck.gl-community/editable-layers' (module has no exports)
ERROR in ./src/App.js 55:61-69
export 'ViewMode' (imported as 'ViewMode') was not found in '@deck.gl-community/editable-layers' (module has no exports)

Steps to Reproduce:

1. Install the packages:

yarn add @deck.gl-community/editable-layers
yarn add @deck.gl-community/react-editable-layers

2. Import the package in your code:

import { EditableGeoJsonLayer, DrawPolygonMode, ViewMode } from '@deck.gl-community/editable-layers';

3. Create the layer and add it to Deck.gl

const layers = [new EditableGeoJsonLayer({id: 'editable-leyer', data:poly, mode:zeleStore==="ZONE_SELECTION"? DrawPolygonMode:  ViewMode, selectedFeatureIndexes:[], onEdit: ({updatedData})=> {setPolyState(updatedData); }})]

<DeckGL style={deckglStyle} layers={layers} controller initialViewState={initialViewState}>

4. Run the project:

yarn start

Expected Behavior:

The package should load without any errors, and the imported components should be available for use.

Actual Behavior:

The package fails to load due to multiple "module not found" errors. It seems like there are missing files or incorrect import paths within the package.
Additional Information:

Any help to resolve these issues would be greatly appreciated.

Kind regards,
Kian

[ibgreen]

@knejadshamsi Thanks for reporting.

Firstly, my apologies, I will ask you to move general help requests like this to the Discussions tab. Issues are for actionable, well-defined bugs. I have updated the github issue template to explain this so you don't have to file your issue twice in the future.

It seems that you may have multiple issues, but one thing that stands out is that deck.gl-community modules are all designed to match deck.gl version numbering, meaning that v9 modules required you to be using deck.gl v9, and your package.json is specifying "@deck.gl/core": "^8.8.23".

[knejadshamsi]

Hello @ibgreen, I appreciate your comment. The version of the package you are referring to was meant for testing nebula.gl. My version of deck.gl that I'm actually using in my code to test this library is using 9.0.25 as mentioned above.

The issue that I'm reporting is not related any package version.

I have strictly followed the "Get Started" guide which caused this issue.
A deeper look in my request is much appreciated.

I suspect lack of react-editable-layers package in yarn that is mentioned in the guide in yarn might be the cause of this issue.

If there is any further context that is required. I would be more than happy to provide.

[ibgreen]

OK yes, I see that the published website is outdated, the naming of the module seems fixed on master. https://github.com/visgl/deck.gl-community/blob/master/docs/modules/editable-layers/developer-guide/get-started.md

Feel free to review it and see if any additional mistakes are there.

So republishing the website should fix this. Unfortunately there are some breakages in the website that need to be resolved before republishing. I'll open an issue

[knejadshamsi]

I tried to follow the instructions in the mentioned link and besides the other error. I'm also getting a list of files that are not available. I've condensed it to list. Let me know if there are more context that could help in resolving this problem:
Errors related to missing files/extensions:
Cannot find module './lib/style'
Cannot find module './lib/deck-renderer/deck-drawer'
Cannot find module './lib/feature'
Cannot find module './lib/layer-mouse-event'
Cannot find module './lib/nebula-layer'
Cannot find module './lib/layers/junctions-layer'
Cannot find module './lib/layers/texts-layer'
Cannot find module './lib/layers/segments-layer'
Cannot find module './lib/nebula-core'
Cannot find module './lib/constants'
Cannot find module './utils/utils'
Cannot find module './editable-layers/editable-geojson-layer'
Cannot find module './editable-layers/editable-h3-cluster-layer'
Cannot find module './editable-layers/selection-layer'
Cannot find module './editable-layers/elevated-edit-handle-layer'
Cannot find module './editable-layers/junction-scatterplot-layer'
Cannot find module './edit-modes/utils'
Cannot find module './edit-modes/geojson-edit-mode'
Cannot find module './edit-modes/modify-mode'
Cannot find module './edit-modes/resize-circle-mode'
Cannot find module './edit-modes/translate-mode'
Cannot find module './edit-modes/scale-mode'
Cannot find module './edit-modes/rotate-mode'
Cannot find module './edit-modes/duplicate-mode'
Cannot find module './edit-modes/extend-line-string-mode'
Cannot find module './edit-modes/split-polygon-mode'
Cannot find module './edit-modes/extrude-mode'
Cannot find module './edit-modes/elevation-mode'
Cannot find module './edit-modes/transform-mode'
Cannot find module './edit-modes/draw-point-mode'
Cannot find module './edit-modes/draw-line-string-mode'
Cannot find module './edit-modes/draw-polygon-mode'
Cannot find module './edit-modes/draw-rectangle-mode'
Cannot find module './edit-modes/draw-square-mode'
Cannot find module './edit-modes/draw-rectangle-from-center-mode'
Cannot find module './edit-modes/draw-square-from-center-mode'
Cannot find module './edit-modes/draw-circle-by-diameter-mode'
Cannot find module './edit-modes/draw-circle-from-center-mode'
Cannot find module './edit-modes/draw-ellipse-by-bounding-box-mode'
Cannot find module './edit-modes/draw-ellipse-using-three-points-mode'
Cannot find module './edit-modes/draw-rectangle-using-three-points-mode'
Cannot find module './edit-modes/draw-90degree-polygon-mode'
Cannot find module './edit-modes/draw-polygon-by-dragging-mode'
Cannot find module './edit-modes/immutable-feature-collection'
Cannot find module './edit-modes/view-mode'
Cannot find module './edit-modes/measure-distance-mode'
Cannot find module './edit-modes/measure-area-mode'
Cannot find module './edit-modes/measure-angle-mode'
Cannot find module './edit-modes/composite-mode'
Cannot find module './edit-modes/snappable-mode'
Cannot find module './utils/memoize'

[knejadshamsi]

Hey @ibgreen, I just tried to create a separate project from scratch and followed the "Get Started" you mentioned here on github.

I only took 2 extra steps:

1. I used Create React App to create my react project (via yarn create react-app my-app). Link
2. I installed the latest version of deck.gl (via yarn add deck.gl) Link

Then I copied the "Small example" code from the guide into App.js, installed the latest version of react-map-gl. Then used yarn start. I'm still encountering the same issue. The project is not compiling. I'm getting the same errors as mentioned above.

[ibgreen]

Yes, confirmed. And a fix has been landed, see #117. unfortunately there are publishing issues, the dev tools setup had to be modernized to fix the issue which broke the publish. Let's hope it is not to hard to fix.

[knejadshamsi]

I'm glad it's confirm. Is there a estimated timeline on a fix?

[ibgreen]

Landed, pending #126

[ibgreen]

Published in v9.0.3, sorry for the long delay