Bug: Cannot read properties of undefined (reading 'getMap') after updated to 1.0.0-next

[Coldsewoo]

Tested versions (local / reproduce)

• three version: 0.166.0 / 0.165.0
• @react-three/fiber version: 8.15.12 / 8.16.8
• react-three-map version: 1.0.0-next.0 / 1.0.0-next.0
• node version: 18.18.2 / 22.14.0
• npm (or yarn) version: 9.2.0 / 11.1.0

Problem description:

I got a Cannot read properties of undefined (reading 'getMap') in Canvas.tsx line 22 after updated to 1.0.0

  const map = useMap().current!.getMap(); // eslint-disable-line @typescript-eslint/no-non-null-assertion

upon loading a canvas.

Relevant code:

https://codesandbox.io/p/devbox/react-three-map-gettings-started-forked-l4sjk7

I've updated the dependencies, but nothing significant changed.

Suggested solution:

The error occurs even when a valid access token isn't provided, so perhaps it needs to wait until the map is fully loaded—at least until useMap() becomes available—or a check should be added for when useMap() returns null.

[RodrigoHamuy]

@Coldsewoo for some reason useMap().current is always undefined in my tests once we enter R3F. Still investigating, sorry is taking a while (not much time left for open source atm). If anybody wants to have a look, you can check #141 which I thought was the cause of the issue.

[Coldsewoo]

@RodrigoHamuy Adding "react-map-gl/mapbox" to the external list in vite.config.ts resolved the issue. I tested it with a fork from the main branch, and it worked in my codebase. I think #141 should resolve the issue.

[RodrigoHamuy]

@Coldsewoo what are you using? vite or your local machine or codesandbox? I think it works fine in a traditional build, but not in codesandbox. Will merge anyway and release again as a beta so you can give it a go.

[Coldsewoo]

@RodrigoHamuy Vite is installed in my project, but I don't think it's quite much related to this issue. I added the line above from the main branch, built the project manually, and copied the dist folder into my codebase then imported index.mjs for testing.

[Coldsewoo]

The newest release is working on my project. Thank you!

https://codesandbox.io/p/devbox/react-three-map-gettings-started-forked-l4sjk7?file=%2Fsrc%2FApp.tsx%3A32%2C18
also works on codesandbox