Issues trying to get webpack example running

[AlanMcCann]

I have been trying to get the webpack-app example running and have only been able to get to the point of this error

VM173 app.js:5671 deck: initialization of CompositeLayer({id: 'my-flowmap-layer'}): dataProvider.updateLayersData is not a function

I'm using the latest master code, deleting the root level package.json and running npm i and npm run start from the webpack-app directory,

It seems like the non-react examples might not be up to date and/or the library is only working completely with react-based.

Any help is appreciated.
Thanks!

[AlanMcCann]

Update:

Using the latest code from main 8.0.0 alpha.25 (#8)

I ran the following to get further

# from the root directory
yarn install
yarn workspace @flowmap.gl/webpack-app start

this results in the following error in the browser js console. The background map shows up but errors prevent the flowmap layer showing up.

deck.js:87 Error: initialization of FlowLinesLayer({id: 'my-flowmap-layer-flow-lines'}): Model needs a program
    at assert (assert.js:3:1)
    at Model._checkProgram (model.js:396:11)
    at Model.initialize (model.js:64:1)
    at new Model (model.js:24:1)
    at FlowLinesLayer._getModel (FlowLinesLayer.js:165:1)
    at FlowLinesLayer.updateState (FlowLinesLayer.js:138:29)
    at FlowLinesLayer._updateState (layer.js:718:1)
    at FlowLinesLayer._initialize (layer.js:690:1)
    at LayerManager._initializeLayer (layer-manager.js:241:1)
    at LayerManager._updateSublayersRecursively (layer-manager.js:210:1)

[ilyabo]

This is related: visgl/luma.gl#1587

[ilyabo]

Hi @AlanMcCann, I just noticed that the deck.gl examples have been updated to use vite instead of webpack. Maybe that's an option for you to try.

[AlanMcCann]

Thanks. I will try that! I appreciate the heads up!

[fy2462]

Can the vite resolve this issue? I have the same problem: check program failed with webpack4

[petrell9]

Hi there, I'm also experiencing the same issue

deck: initialization of CompositeLayer({id: 'my-flowmap-layer'}): dataProvider.updateLayersData is not a function

I inspected the dataProvider the layer created and none of the functions defined were present on the object at all. I duplicated the class LocalFlowmapDataProvider into my project and that made the above error go away but a new one took it's place (I can't recall what it was exactly, but another null reference error).

I cloned the repository locally, built it successfully, and used npm link to define the project locally. This worked with no errors and I was able to display the flowmap perfectly. I'm not 100% sure, but it seems like the published data entrypoint library has an issue?

[ilyabo]

I cloned the repository locally, built it successfully, and used npm link to define the project locally. This worked with no errors and I was able to display the flowmap perfectly. I'm not 100% sure, but it seems like the published data entrypoint library has an issue?

That's interesting. So you get no errors when you npm link flowmap.gl in your app while it fails when you use flowmap.gl from npm, right? I wonder what might be different when you build locally. Do you bundle your main app with webpack?

I hope to publish a new release in the next few days with all the deps updated. Maybe it helps to resolve the issue.

[petrell9]

That's interesting. So you get no errors when you npm link flowmap.gl in your app while it fails when you use flowmap.gl from npm, right? I wonder what might be different when you build locally.

Yes that's correct. I should also mention I used npm link to link the data entrypoint to the layers entrypoint before building it. But Git reports no changes in my local copy either.

Do you bundle your main app with webpack?

It's an Angular project so I believe that uses webpack under the hood. For deck.gl examples, I usually use the vanilla html ones as a reference as it's easier to convert to Angular.

When you release a new version, I can try the published npm build again and let you know if that fixes things.